(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" ...
随机推荐
- Vuex入门、同步异步 存取值
目的: 1.了解vuex中的各个js文件的用途 2.利用vuex存值 3.利用vuex取值 4.Vuex的异步同步加载问题 1. vuex中各个组件之间传值 1.父子组件 父组件-->子组件,通 ...
- Authentication源码解析
1.获取当前的 Subject. 调用 SecurityUtils.getSubject(); 从当前线程的threadLocals属性中获取Subject对象 SecurityUtils publi ...
- Mock常用占位符一览
1.随机字符串(类型 , 位数)@string(lower,10) lower : 小写字母upper : 大写字母number : 数字 2.随机int(下限 , 上限)@integer(60, 1 ...
- ABP 基于DDD的.NET开发框架 学习(二)创建实体
1.创建模型类打开.Core项目,新建新建一个项目文件夹(Demo);为了演示表关联及外键的使用,创建两个类:创建类ClothesCategoty.csusing Abp.Domain.Entitie ...
- 3_PHP表达式_4_PHP运算符
以下为学习孔祥盛主编的<PHP编程基础与实例教程>(第二版)所做的笔记. 3.4.1 算术运算符 <?php $num1 = -10; $num2 = -4; $num3 = $nu ...
- python列表操作大全
Python列表操作大全 对于python列表的理解可以和C语言里面的数组进行比较性的记忆与对照,它们比较相似,对于python里面列表的定义可以直接用方括号里加所包含对象的方法,并且python的列 ...
- 清楚html和css标签自带默认样式
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, ...
- Linux 命令之 alias
alias 的作用是为命令设置别名,用于提高输入效率 alias 的临时设置 临时设置很简单,直接举例说明 [r@1lin24 ~]$ alias cdlog='cd /var/log' [r@1li ...
- java - day019 - 数据库
https://www.cnblogs.com/myxq666/p/7787744.html Mac 安装MySQL步骤 什么是数据库 数据库: 英文名称Database ,简称 DB 数据库是按照数 ...
- DNS服务——域名解析容错
介绍 DNS服务至关重要,你我每天访问网站不可能是记忆IP地址.因此DNS服务器的可靠性至关重要.下面介绍DNS服务器容错机制,看图 为了防止DNS服务器故障不再提供服务,引入辅助DNS服务器.辅助D ...