创建一个 .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. 爬取沪深a股数据

    首先从东方财富网获取股票代码 再从网易财经下载股票历史数据 import requests import random from bs4 import BeautifulSoup as bs impo ...

  2. layUI学习第四日：layUI布局系列一

    1.栅格布局规则 1.1 layui-row定义行,如:<div class="layui-row"></div> 1.2 layui-col-md*这样的 ...

  3. luoguP4022 [CTSC2012]熟悉的文章

    题意 显然这个\(L\)是可以二分的,我们只需要判断\(L\)是否合法即可. 显然有一个\(O(n^2)\)的DP: 设\(f_i\)表示当前匹配到\(i\)的最大匹配长度. \(f_i=max(f_ ...

  4. IT人的立功，立言，立德三不朽

    最近几个月很忙,忙着当奶爸,忙着做加班狗,忙着补裤裆学技术……以至于快忘了要思考人生了! 古人立志穷极一生追求“立德”,“立功”,“立言”,以求不朽,为万世所景仰,为后人所传颂,实现人生的意义.立德者 ...

  5. docker /var/lib/docker/aufs/mnt 目录满了怎么清理

    1.创建脚本文件 vi cleandocker.sh 内容如下: #!/bin/sh echo "==================== start clean docker contai ...

  6. OC：浅析Runtime中消息转发机制

    一.介绍 OC是一门动态性语言,其实现的本质是利用runtime机制.在runtime中,对象调用方法,其实就是给对象发送一个消息,也即objc_msgSend().在这个消息发送的过程中,系统会进行 ...

  7. leetcode一刷总结，明天二刷

    1:基础的数据结构:图掌握极差,二叉树次之 2:常用的算法思想:dp,深度有先,广度优先等等. 3:优化以解决的题目,注意思想的总结 4:将约150道题都刷掉 5:优先解决设计算法思想的题目类别,其次 ...

  8. Node 之 Express 4x 骨架详解

    周末,没事就来公司加班继续研究一下Express ,这也许也是单身狗的生活吧. 1.目录结构: bin, 存放启动项目的脚本文件 node_modules, 项目所有依赖的库,以及存放 package ...

  9. Mybatis技术内幕(一)——整体架构概览

    Mybatis技术内幕(一)--整体架构概览 Mybatis的整体架构分为三层,分别是基础支持层.核心处理层和接口层. 如图所示: 一.基础支持层 基础支持层包含整个Mybatis的基础模块,这些模块 ...

  10. node.js中this指向失效解决

    问题:在外部单独使用类实例对象的方法,this没有指向该类实例对象 代码如下 class CQH { hello() { let name = this.name(); console.log(`He ...