创建一个 .html 文件，然后通过如下方式引入 Vue：

<!-- 开发环境版本，包含了有帮助的命令行警告 -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

<!-- 生产环境版本，优化了尺寸和速度 -->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>

创建一个demo.html，在页面显示 "Hello Vue!"：

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>

    <body>
        <div id="app">
            {{ message }}
        </div>
    </body>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script>
        var app = new Vue({
            el: '#app',
            data: {
                message: 'Hello Vue!'
            }
        })
    </script>

</html>

Vue入门案例（二）的更多相关文章

  1. Vue入门（二）之数据绑定

    Vue官网: https://cn.vuejs.org/v2/guide/forms.html#基础用法 [入门系列] (一)  http://www.cnblogs.com/gdsblog/p/78 ...

  2. Quartz应用实践入门案例二(基于java工程)

    在web应用程序中添加定时任务,Quartz的简单介绍可以参看博文<Quartz应用实践入门案例一(基于Web应用)> .其实一旦学会了如何应用开源框架就应该很容易将这中框架应用与自己的任 ...

  3. vue入门案例

    1.技术在迭代,有时候你为了生活没有办法,必须掌握一些新的技术,可能你不会或者没有时间造轮子,那么就先把利用轮子吧. <!DOCTYPE html> <html> <he ...

  4. vue入门（二） 让axios发送表单形式数据

    (一) 使用 axios vue-axios qs 1.qs是必不可少的插件 npm install --save axios vue-axios qs 2.安装完成后,在main.js插入以下代码 ...

  5. Vue入门（二）

    1.vue3.0安装 cnpm install -g @vue/cli 或者 yarn global add @vue/cli //创建项目 vue create hello-world //运行 n ...

  6. Vue入门（二）——Demo

    1.在工程目录下创建项目 右键GIT BASH 2.安装lib(建议使用淘宝镜像安装) 3.首页 App.vue <template> <el-container> <e ...

  7. Quartz应用实践入门案例一（基于Web环境）

    Quartz是一个完全由java编写的开源作业调度框架,正是因为这个框架整合了许多额外的功能,所以在使用上就显得相当容易.只是需要简单的配置一下就能轻松的使用任务调度了.在Quartz中,真正执行的j ...

  8. _00017 Kafka的体系结构介绍以及Kafka入门案例(0基础案例+Java API的使用)

    博文作者:妳那伊抹微笑 itdog8 地址链接 : http://www.itdog8.com(个人链接) 博客地址:http://blog.csdn.net/u012185296 博文标题:_000 ...

  9. Python爬虫Scrapy(二)_入门案例

    本章将从案例开始介绍python scrapy框架,更多内容请参考:python学习指南 入门案例 学习目标 创建一个Scrapy项目 定义提取的结构化数据(Item) 编写爬取网站的Spider并提 ...

随机推荐

  1. xampp配置二级域名通过不同端口访问不同网站

    首先需要在xampp\apache\conf\extra\httpd-vhost.conf中写入配置的二级域名 <VirtualHost *:8081> // 该网站通过监测8081端口 ...

  2. 201871010108-高文利《面向对象程序设计（java）》第一周学习总结

    项目 内容 这个作业属于哪个课程 <任课教师博客主页链接>  https://www.cnblogs.com/nwnu-daizh/ 这个作业的要求在哪里 <作业链接地址>  ...

  3. 从傅里叶变换(FFT)到数论变换(NTT)

    FFT可以用来计算多项式乘法,但是复数的运算中含有大量的浮点数,精度较低.对于只有整数参与运算的多项式,有时,\(\text{NTT(Number-Theoretic Transform)}\)会是更 ...

  4. Java之封装性

    封装概述 面向对象编程语言是对客观世界的模拟,客观世界里成员变量都是隐藏在对象内部的,外界无法直接操作和修改. 封装可以被认为是一个保护屏障,防止该类的代码和数据被其他类随意访问.要访问该类的数据,必 ...

  5. 使用composer安装Larave提示“Changed current directory to C:/Users/Administrator/AppData/Roaming/Composer”

    解决办法: 根据官方手册执行composer global require "laravel/installer" 显示Changed current directory to C ...

  6. perl: warning: Setting locale failed. 解决

    perl: warning: Setting locale failed. perl: warning: Please check that your locale settings: LANGUAG ...

  7. Qt Designer布局预览正常，代码调用时所有控件堆在一起

    一.实验环境 1.Windows10x64 2.anaconda4.6.9 + python3.7.1(anaconda集成,不需单独安装) 3.pyinstaller3.5 二.问题描述 1.Qt ...

  8. spring cloud 2.x版本 Gateway路由网关教程

    前言 本文采用Spring cloud本文为2.1.8RELEASE,version=Greenwich.SR3 本文基于前两篇文章eureka-server.eureka-client.eureka ...

  9. 练手WPF（一）——模拟时钟与数字时钟的制作（中）

    今天接着制作数字时钟 数字时钟主要用到Path控件,主要用于定义数字笔划的形状. (1)添加一个DigitLine类 数字时钟的数字8由7笔组成,看如下定义的字段字符串数组PathDatas,每个st ...

  10. ASP.NET MVC AJAX 请求中加入 antiforgerytoken 解决“所需的防伪表单字段“__RequestVerificationToken”不存在”问题

    在ASP.NET mvc中如果在表中使用了@Html.AntiForgeryToken(),ajax post不会请求成功 解决方法是在ajax中加入__RequestVerificationToke ...