(3)打鸡儿教你Vue.js
vue.js是一套构建用户界面的渐进式框架
vue关注视图层,采用自底向上增量开发的设计
<div id="app">
<p>{{ message }}</p>
</div>
vue.js安装
下载 vue.min.js 并用

npm install vue
cd my-project
npm install
npm run dev
# 全局安装 vue-cli
$ cnpm install --global vue-cli
# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 这里需要进行一些配置,默认回车即可
This will install Vue 2.x version of the template.
For Vue 1.x use: vue init webpack#1.0 my-project
# 全局安装 vue-cli
$ cnpm install --global vue-cli
# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 这里需要进行一些配置,默认回车即可
$ cd my-project
$ cnpm install
$ cnpm run dev
DONE Compiled successfully in 4388ms
> Listening at http://localhost:8080
目录结构:

build 项目构建(webpack)相关代码
config 配置目录
node_modules npm 加载的项目依赖模块
static 静态资源目录
test 初始测试目录
package.json 项目配置文件

通过实例化Vue实现:
var vm = new Vue({
// 选项
})
{{ }} 用于输出对象属性和函数返回值

var vm = new Vue({
el: '#vue_det',
data: data
})
document.write(vm.$data === data) // true
document.write("<br>")
document.write(vm.$el === document.getElementById('vue_det')) // true
请点赞!因为你的鼓励是我写作的最大动力!
吹逼交流群:711613774

(3)打鸡儿教你Vue.js的更多相关文章
- (29)打鸡儿教你Vue.js
web阅读器开发 epub格式的解析原理 Vue.js+epub.js实现一个简单的阅读器 实现阅读器的基础功能 字号选择,背景颜色 有上一页,下一页的功能 设置字号,切换主题,进度按钮 电子书目录 ...
- (26)打鸡儿教你Vue.js
weex框架的使用 1.weex开发入门 2.weex开发环境搭建 3.掌握部分weex组件模块 4.了解一些vue基本常见语法 5.制作一个接近原生应用体验的app weex介绍 安装开发环境 We ...
- (22)打鸡儿教你Vue.js
vue.js 单页面,多页面 Vue cli工具 复杂单页面应用Vue cli工具 交互设计,逻辑设计,接口设计 代码实现,线上测试 git clone,git int 创建分支,推送分支,合并分支 ...
- (21)打鸡儿教你Vue.js
组件化思想: 组件化实现功能模块的复用 高执行效率 开发单页面复杂应用 组件状态管理(vuex) 多组件的混合使用 vue-router 代码规范 vue-router <template> ...
- (19)打鸡儿教你Vue.js
了解vue2.x的核心技术 建立前端组件化的思想 常用的vue语法 vue-router,vuex,vue-cli 使用vue-cli工具 Vue框架常用知识点 vue核心技术 集成Vue 重点看,重 ...
- (18)打鸡儿教你Vue.js
介绍一下怎么安装Vue.js vue.js Vue 不支持 IE8 及以下版本,因为 Vue 使用了 IE8 无法模拟的 ECMAScript 5 特性. Vue.js是一个渐进的,可逐步采用的Jav ...
- (17)打鸡儿教你Vue.js
vue-router <a class="list-group-item" v-link="{ path: '/home'}">Home</a ...
- (15)打鸡儿教你Vue.js
组件化vue.js 组件单向绑定 组件双向绑定 组件单次绑定 创建组件构造器 注册组件 使用组件 Vue.extend() Vue.component() 使用组件 <div id=" ...
- (13)打鸡儿教你Vue.js
一小时复习 vue.js是一个JavaScriptmvvm库,是以数据驱动和组件化的思想构建的,相比angular.js,vue.js提供了更加简洁,更加容易理解的api,如果习惯了jquery操作d ...
- (12)打鸡儿教你Vue.js
组件 语法格式如下: Vue.component(tagName, options) <tagName></tagName> <div id="app" ...
随机推荐
- Spring Boot配置文件的加载顺序
配置文件的加载顺序, 后加载的会覆盖先加载的:也就是properties配置文件的内容会替换掉.yml及.yaml文件的内容
- docker registry-v2 搭建私有仓库
参考官方文档:https://docs.docker.com/registry/deploying/ 参考 :http://www.tuicool.com/articles/6jEJZj 本例子使用两 ...
- 在论坛中出现的比较难的sql问题:44(触发器专题 明细表插入数据时调用主表对应的数据)
原文:在论坛中出现的比较难的sql问题:44(触发器专题 明细表插入数据时调用主表对应的数据) 最近,在论坛中,遇到了不少比较难的sql问题,虽然自己都能解决,但发现过几天后,就记不起来了,也忘记解决 ...
- 在论坛中出现的比较难的sql问题:32(row_number函数+子查询 sql循环取差值)
原文:在论坛中出现的比较难的sql问题:32(row_number函数+子查询 sql循环取差值) 所以,觉得有必要记录下来,这样以后再次碰到这类问题,也能从中获取解答的思路. sql循环取差值,该怎 ...
- Java Web-Redis学习
Java Web-Redis学习 基本概念 Redis是一款高性能的NOSQL系列的.非关系型数据库 NOSQL:not only SQL,是一系列非关系型数据库的总称,例如radis.hbase等数 ...
- TODO-依赖注入与控制反转
交互框架之Actor与Listener的关系 https://www.cnblogs.com/mq0036/p/7473371.html
- ceph集群部署(基于jewel版)
环境 两个节点:ceph1.ceph2 ceph1: mon.mds.osd.0.osd.1 ceph2: osd.2.osd.3 网络配置: ceph1: 管理网络,eth0,10.0.0.20 存 ...
- Nginx 安装目录 和 编译参数
安装目录详解 查看安装nginx之后总共生成了哪些文件 rpm -ql nginx 在上面的文件中包括配置文件和日志文件 /etc/logrotate.d/nginx 类型:配置文件 作用:Nginx ...
- Git Git 已被其他开发删除的远程分支,本地依旧显示,如何删除?
- java--分析简单java类与反射的联系
分析简单java类与反射的联系 web对反射的操作支持 在JSP之中有一种技术--javaBean.而且在jsp里面也配套有相应的操作方式,javaBean的核心在于简单java类,于是下面演示此操作 ...