在前一章基础上开发。

1、下载vue.js。(https://cn.vuejs.org/v2/guide/installation.html)

在hello-vue根目录下创建js文件夹，并将该vue.js放入。

2、新建index2.html

<!DOCTYPE html>

<html lang="en">

  <head>

    <meta charset="utf-8" >

    <title>第一个vue项目</title>

    <script src="js/vue.js"></script>

  </head>

  <body>

    <div id="app">

      <!-- 模板，用于展示数据 -->

      {{msg}}

    </div>

    <script>

      new Vue({

        el:"#app",

        data() {

          return {

            msg:"hello 遥远2!"

          }

        },

      })

    </script>

  </body>

</html>

完整结构

最后，运行任务

vue（4）hello world的更多相关文章

  1. 一步一步学习Vue（六）

    本篇继续介绍vue-router,我们需要要完成这样个demo:<分页显示文章列表>:这里我们以博客园首页列表为例简化处理: 按照上图框选所示,简单分为蓝色部分文章组件(ArticleIt ...

  2. 一步一步学习Vue（十一）

    本篇继续学习vuex,还是以实例为主:我们以一步一步学Vue(四)中讲述的例子为基础,对其改造,基于vuex重构一遍,这是原始的代码: todolist.js ; (function () { var ...

  3. vue（9）—— 组件化开发 - webpack（3）

    前面两个终于把webpack相关配置解析完了.现在终于进入vue的开发了 vue组件化开发预热 前期准备 创建如下项目: app.js: footer.js: main.js: webpack.con ...

  4. vue（8）—— 组件化开发 - webpack（2）

    webpack的常用loder和插件 loder和插件是什么,现在暂且不表,看到后面你就懂了 引入css问题 直接用link标签导入css 在前面的 vue(7)—— 组件化开发 — webpack( ...

  5. vue（2）—— vue简单语法运用，常用指令集

    按照前面的文章:vue(1)——node.js安装使用,利用npm安装vue  安装完vue之后,就可以使用vue了 vue vue简介 前面安装好vue之后,确实还没有对vue进行介绍,首先,官网: ...

  6. 一步一步学Vue（六）

    本篇继续介绍vue-router,我们需要要完成这样个demo:<分页显示文章列表>:这里我们以博客园首页列表为例简化处理: 按照上图框选所示,简单分为蓝色部分文章组件(ArticleIt ...

  7. 下载vuejs,Hello Vue（vscode）

    下载vuejs,Hello Vue(vscode) Hello Vue 下载使用vue.js 动图演示 Vue的基本使用步骤  传送门:https://cn.vuejs.org/v2/guide/in ...

  8. 一步一步学Vue（九） 路由元数据

    一步一步学Vue(九):https://www.cnblogs.com/Johnzhang/p/7260888.html

  9. 一步一步学Vue（六）https://www.cnblogs.com/Johnzhang/p/7242640.html

    一步一步学Vue(六):https://www.cnblogs.com/Johnzhang/p/7237065.html  路由 一步一步学Vue(七):https://www.cnblogs.com ...

  10. vue（element）中使用codemirror实现代码高亮，代码补全，版本差异对比

    vue(element)中使用codemirror实现代码高亮,代码补全,版本差异对比 使用的是vue语言,用element的组件,要做一个在线编辑代码,要求输入代码内容,可以进行高亮展示,可以切换各 ...

随机推荐

  1. ubuntu16.04 安装caffe2

    1.使用conda创建环境 conda create --name caffe2env python=3.6 ---------------------------------success----- ...

  2. matlab rand(3,5)

    rand()函数在(0,1)上创建均匀分布的随机数的数组 >> rand(3,5) ans = 0.8147 0.9134 0.2785 0.9649 0.9572 0.9058 0.63 ...

  3. alias这个命令还是很有用的

    这是在知乎看到的一个回答. 我一开始学习linux命令的时候觉得这个alias命令很奇怪,为什么要给别人起个别名呢?有什么好处? 因为当时接触的是比较简单的命令 比如ls -al的这种短小的命令,对a ...

  4. 校园客户端（DR）启动后提示我们缺失packet.dll，无法正常启动（7）

    有的时候校园客户端(DR)启动后提示我们缺失packet.dll,无法正常启动,然而我们重装了客户端后任然不感冒,那么问题来了,问题解决不了往往源于我们对问题的本质不够了解,如果了解问题的本质,那么问 ...

  5. little case1

    这句话有问题: frame.setContentPane().add(button); The method setContentPane(Container) in the type JFrame ...

  6. Mat 类的内存管理

    使用 Mat 类,内存管理变得简单,不再像使用 IplImage 那样需要自己申请和释放内存.虽然不了解 Mat 的内存管理机制,也无碍于 Mat 类的使用,但是如果清楚了解 Mat 的内存管理,会更 ...

  7. 数学基础-3D空间的位置表示

    转自:http://www.cnblogs.com/gaoxiang12/p/5113334.html 刚体运动 本篇讨论一个很基础的问题:如何描述机器人的位姿.这也是SLAM研究的一个很基本的问题. ...

  8. LeetCode第114题：二叉树展开为链表

    问题描述 给定一个二叉树,原地将它展开为链表. 例如,给定二叉树 1 / \ 2 5 / \ \ 3 4 6 将其展开为: 1 \ 2 \ 3 \ 4 \ 5 \ 6 解题思路 二叉树的一些算法题都可 ...

  9. Mac下的UI自动化测试 （二）

    下面讲一下Sikuli的重要概念,就是region,所谓region就是Sikuli在进行图像识别的时候的一个区域,默认是整个屏幕. 当然,如果region选得太大的话,并且UI上存在相似的控件,那么 ...

  10. 设置datalist指定行的背景色

    前台: <div class="table-responsive" > <table class="table table-bordered table ...