vue(4)hello world
在前一章基础上开发。
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的更多相关文章
- 一步一步学习Vue(六)
本篇继续介绍vue-router,我们需要要完成这样个demo:<分页显示文章列表>:这里我们以博客园首页列表为例简化处理: 按照上图框选所示,简单分为蓝色部分文章组件(ArticleIt ...
- 一步一步学习Vue(十一)
本篇继续学习vuex,还是以实例为主:我们以一步一步学Vue(四)中讲述的例子为基础,对其改造,基于vuex重构一遍,这是原始的代码: todolist.js ; (function () { var ...
- vue(9)—— 组件化开发 - webpack(3)
前面两个终于把webpack相关配置解析完了.现在终于进入vue的开发了 vue组件化开发预热 前期准备 创建如下项目: app.js: footer.js: main.js: webpack.con ...
- vue(8)—— 组件化开发 - webpack(2)
webpack的常用loder和插件 loder和插件是什么,现在暂且不表,看到后面你就懂了 引入css问题 直接用link标签导入css 在前面的 vue(7)—— 组件化开发 — webpack( ...
- vue(2)—— vue简单语法运用,常用指令集
按照前面的文章:vue(1)——node.js安装使用,利用npm安装vue 安装完vue之后,就可以使用vue了 vue vue简介 前面安装好vue之后,确实还没有对vue进行介绍,首先,官网: ...
- 一步一步学Vue(六)
本篇继续介绍vue-router,我们需要要完成这样个demo:<分页显示文章列表>:这里我们以博客园首页列表为例简化处理: 按照上图框选所示,简单分为蓝色部分文章组件(ArticleIt ...
- 下载vuejs,Hello Vue(vscode)
下载vuejs,Hello Vue(vscode) Hello Vue 下载使用vue.js 动图演示 Vue的基本使用步骤 传送门:https://cn.vuejs.org/v2/guide/in ...
- 一步一步学Vue(九) 路由元数据
一步一步学Vue(九):https://www.cnblogs.com/Johnzhang/p/7260888.html
- 一步一步学Vue(六)https://www.cnblogs.com/Johnzhang/p/7242640.html
一步一步学Vue(六):https://www.cnblogs.com/Johnzhang/p/7237065.html 路由 一步一步学Vue(七):https://www.cnblogs.com ...
- vue(element)中使用codemirror实现代码高亮,代码补全,版本差异对比
vue(element)中使用codemirror实现代码高亮,代码补全,版本差异对比 使用的是vue语言,用element的组件,要做一个在线编辑代码,要求输入代码内容,可以进行高亮展示,可以切换各 ...
随机推荐
- ngx-bootstrap使用01 安装ngx-bootstrap和bootstrap及其使用、外部样式引入
1 版本说明 2 新建一个angular项目 ng new 项目名 --stayle=scss 代码解释:创建一个样式文件格式为SCSS的angular项目 技巧01:由于我angular-cli的版 ...
- SpringBoot11 读取properties文件、发送邮件
1 读取properties文件 1.1 ResourceBundle 帮助我们事先国际化 1.1.1 前提 properties文件的命名方式必须体现除语言和国别 例如:test_zh_CN.pro ...
- java的类型转换问题。int a = 123456;short b = (short)a;System.out.println(b);为什么结果是-7616?
这个从二进制来解释: int 是 32 位,也就是最多能表示长度为 32 位的二进制整数.第一位是符号位,表示正负,0 表示正的,1 表示负的.当首位为 1(为负)时,把所有的位取反(0 变成 1,1 ...
- 100198H Royal Federation
传送门 题目大意 国家有N个城市,任意城市可以到达任意城市,是一棵树.国王要给这些城市分省份.每个省份最少M个城市,最多3M个城市.每个省有一个首府,首府不一定是这个省的城市,只是首府到这个省各个城市 ...
- bzoj2134 错选单位
传送门 题目 Input n很大,为了避免读入耗时太多, 输入文件只有5个整数参数n, A, B, C, a1, 由上交的程序产生数列a. 下面给出pascal/C/C++的读入语句和产生序列的语句( ...
- Luogu 3942 将军令
之前写那个(Luogu 2279) [HNOI2003]消防局的设立的时候暴力推了一个树形dp,然后就导致这个题不太会写. 贪心,先把树建出来,然后考虑按照结点深度排个序,每次取出还没有被覆盖掉的深度 ...
- plsql developer 常用配置
执行语句时间太长,关闭 plsql developer 重启 F8 执行SQL 1 设置默认执行鼠标所在sql tools->preferences->sql window->win ...
- Mac安装破解版Office 2016办公软件
一.相关软件 Microsoft Office 2016 For Mac Cracker 破解工具 资源地址(链接:https://pan.baidu.com/s/1Z5CIv-XbxS08MniYN ...
- MySQL数据导入导出方法与工具mysqlimport
MySQL数据导入导出方法与工具mysqlimport<?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office ...
- fiddler----APP弱网测试
转自:http://www.51testing.com/html/01/n-3727001.html APP弱网模拟测试 移动端测试区别于PC端测试的一点就是网络的多变性:不同的网络环境和网络制式的差 ...