创建一个 .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. 【hdu4045】Machine scheduling（dp+第二类斯特林数）

    传送门 题意: 从\(n\)个人中选\(r\)个出来,但每两个人的标号不能少于\(k\). 再将\(r\)个人分为不超过\(m\)个集合. 问有多少种方案. 思路: 直接\(dp\)预处理出从\(n\ ...

  2. C++ 虚函数的说明

    虚函数的几点说明: 1. 当一个成员函数定义为虚函数时,其派生类中的同名函数也自动为虚函数.无论其是否添加了 virtual 关键字. 为了能良好的阅读代码,请加上. 2. 父类的虚函数,就是为了让子 ...

  3. SpringMVC重定向路径中带中文参数

    SpringMVC重定向路径中带中文参数 springboot重定向到后端接口测试 package com.mozq.http.http_01.demo; import org.springframe ...

  4. SpringCloud单元测试【六】

    SpringCloud的单元测试主要是依靠 Mock以及Mockito, 所以我们需要对Mock以及Mockito有一定的认识. 一.为什么要用MockMvc 可能我们在测试控制层的代码都是启动服务器 ...

  5. 使用 github pages快速部署自己的静态网页

    看见很多大神在Github Pages上部署Demo,感觉效果还不错,刚才自己也试了一下,发现其实并不难! 选择 github pages 的理由 使用零成本: github pages 集成在 gi ...

  6. springboot整合shiro进行权限管理

    背景:springboot2.1,shiro1.4:由于目前的小项目没做登录,但是客户又需要加上权限,因此楼主就想到了shiro(这是单独的项目,需要集成后台管理系统) shiro简介 Apache ...

  7. Python连载44-XML其他注意点

    一.XML文件注意点 1.内容中不能出现尖括号 例如:下面是不合法的 <grade>成绩<90</grade> 解决方案:使用实体引用<EntityReferenc ...

  8. pytorch_13-图像处理之skimage

    之前程序使用的是PIL(Python image library),今天遇到了另一种图像处理包--skimage. skimage即scikit-image,PIL和Pillow只提供最基础的数字图像 ...

  9. 【Linux命令】文件目录管理命令7个（touch、mkdir、cp、mv、rm、dd、file）

    目录 touch创建空白文档或设置文件时间 mkdir创建空白目录 cp复制文件或目录 mv剪切文件或重命名文件 rm删除文件或目录 dd按照指定大小和个数的数据库来复制文件或转换文件 file查看文 ...

  10. pytest框架与unittest框架的对比

    一.pytest的优势 pytest是基于unittest之上的单元测试框架,它的优势如下: 自动发现测试模块和测试方法 断言使用 assert + 表达式 可以设置测试会话级(session).模块 ...