摘要: 指令(Directives) 是带有v- 前缀的特殊属性,指令属性是单一的js表达式. 指令的职责就是表达式的值发生变化时,在DOM中做出相应的回应. 如下例子: 实例 <div id="app"> <p v-if="seen">现在你看到我了</p> </div> <script> new Vue 阅读全文
posted @ 2017-11-11 19:14 goodman8 阅读(361) 评论(0) 推荐(0) 编辑
摘要: vue-cli是vue.js的脚手架,用于自动生成vue.js工程模板的. 步骤: 2.安装 ->全局安装 npm install vue-cli -g 或者 cnpm install vue-cli -g ->查看是否安装成功 vue -V(大写的V) 3.使用 ->生成项目名是wsw的模板 vu 阅读全文
posted @ 2017-11-11 19:11 goodman8 阅读(402) 评论(0) 推荐(0) 编辑
摘要: 监听事件 事件:click\keydown <button v-on:click="greet"></button> 可以简写为 <button @click="greet"></button> v-on 可以接收一个定义的方法来调用。 示例: <div id="example-2"> <!-- ` 阅读全文
posted @ 2017-11-11 19:06 goodman8 阅读(318) 评论(0) 推荐(0) 编辑
摘要: 列表渲染 我们用 v-for 指令根据一组数组的选项列表进行渲染。v-for 指令需要使用item in items 形式的特殊语法,items 是源数据数组并且 item 是数组元素迭代的别名。 <ul id="example-1"> <li v-for="item in items"> {{ i 阅读全文
posted @ 2017-11-11 18:49 goodman8 阅读(1233) 评论(0) 推荐(0) 编辑
摘要: v-bind 指令可以更新 HTML 属性: <a v-bind:href="url">...</a> 在这里 href 是参数,告知 v-bind 指令将该元素的 href 属性与表达式 url 的值绑定。 缩写: <a :href="url">...</a> 阅读全文
posted @ 2017-11-11 18:39 goodman8 阅读(270) 评论(0) 推荐(0) 编辑
摘要: v-text://插入一段文本<div id="app"> <p v-text="message"></p></div><script> var vm = new Vue({ el:'#app', data:{ message:'hello world !' } })</script> v-html 阅读全文
posted @ 2017-11-11 18:34 goodman8 阅读(896) 评论(0) 推荐(0) 编辑
摘要: 文本 数据绑定最常见的形式就是使用“Mustache”语法 (双大括号) 的文本插值: <span>Message: {{ msg }}</span> Mustache 标签将会被替代为对应数据对象上 msg 属性的值。无论何时,绑定的数据对象上 msg 属性发生了改变,插值处的内容都会更新。 通过 阅读全文
posted @ 2017-11-11 17:52 goodman8 阅读(282) 评论(0) 推荐(0) 编辑
摘要: 每个 Vue 应用都是通过 Vue 函数创建一个新的 Vue 实例开始的: var vm = new Vue({ // 选项 }) 选项:el、data、methods el: 类型:string | HTMLElement 限制:只在由 new 创建的实例中遵守。 详细:提供一个在页面上已存在的 阅读全文
posted @ 2017-11-11 17:33 goodman8 阅读(1415) 评论(0) 推荐(0) 编辑
摘要: 一.路由 1.vue中的路由也是根据用户提交不同的路径参数,显示不同的页面内容. 2.安装并使用 ->直接引入 <script src="vue-router.js"></script> ->也可以用npm 安装. npm install vue-router --save-dev 注意:如果使用模 阅读全文
posted @ 2017-11-11 16:54 goodman8 阅读(225) 评论(0) 推荐(0) 编辑
摘要: 说到状态管理,本质上就是把整个应用抽象为下图中的循环。脸书最早提出 Flux 这个概念的时,也是一个很松散的概念,而且官方的实现本身做得很难用。所以,社区就做了各种各样的探索。图中的这三个东西是一个单向数据流,State 驱动 View 的渲染,而用户对 View 进行操作产生 Action,会使S 阅读全文
posted @ 2017-11-11 16:53 goodman8 阅读(407) 评论(0) 推荐(0) 编辑
摘要: 现在基本所有的框架都已经认同这个看法——DOM应尽可能是一个函数式到状态的映射。状态即是唯一的真相,而DOM状态只是数据状态的一个映射。如下图所示,所有的逻辑尽可能在状态的层面去进行,当状态改变的时候,View应该是在框架帮助下自动更新到合理的状态,而不是说当你观测到数据变化之后手动选择一个元素,再 阅读全文
posted @ 2017-11-11 16:50 goodman8 阅读(12352) 评论(0) 推荐(1) 编辑
摘要: 1、数据驱动视图 <div id="app"> <p> {{ message }}<p> </div> var app = new Vue({ el: '#app', data: { message: 'Hello Vue!' } }) 2、组件化(单页面应用) Vue的组件引入构建工具之后有一个单 阅读全文
posted @ 2017-11-11 16:49 goodman8 阅读(629) 评论(0) 推荐(0) 编辑
摘要: Vue.js 是什么 Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的 渐进式框架。Vue 采用自底向上增量开发的设计。 Vue 的核心库只关注视图层。 单页应用:Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。 渐进式框架: 声明式渲染和 阅读全文
posted @ 2017-11-11 16:01 goodman8 阅读(415) 评论(0) 推荐(0) 编辑
摘要: Object.defineProperty() Object.defineProperty() 方法直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象。 语法 1 参数 obj 需要定义属性的对象。 prop 需被定义或修改的属性名。 descriptor 需被定义或修改的 阅读全文
posted @ 2017-11-10 19:12 goodman8 阅读(327) 评论(0) 推荐(0) 编辑
摘要: npm介绍 -g:全局安装。 将会安装在C:\Users\Administrator\AppData\Roaming\npm,并且写入系统环境变量; 非全局安装:将会安装在当前定位目录; 全局安装可以通过命令行在任何地方调用它,本地安装将安装在定位目录的node_modules文件夹下,通过requ 阅读全文
posted @ 2017-11-10 18:40 goodman8 阅读(314) 评论(0) 推荐(0) 编辑