- 博客(7)
- 收藏
- 关注
RSS订阅原创 初学vue——part7
组件基础 基础组件示例 // 定义一个名为 button-counter 的新组件 Vue.component('button-counter', { data: function () { return { count: 0 } }, template: '<button v-on:click="count++">You clicked me {{ count }} times.</button>' }) 组件可以进行任意次数的复用 一个
2020-05-11 19:55:16
215
原创 初学vue——part6
表单输入绑定 指令v-model： 你可以用 v-model 指令在表单 <input>、<textarea> 及 <select> 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。 v-model 本质上不过是语法糖。它负责监听用户的输入事件以更新数据，并对一些极端场景进行一些特殊处理。 v-model 在内部为不同的输入元素使用不同的属...
2020-04-20 17:29:19
108
原创 初学VUE——part5
事件处理 事件监听指令：v-on v-on要接收一个需要调用的方法名称。 例子： <div id="example-2"> <!-- `greet` 是在下面定义的方法名 --> <button v-on:click="greet">Greet</button> </div> var example2 = new Vue({ ...
2020-04-13 18:01:08
93
原创 初学vue——part4
条件渲染 指令 作用 v-if 用于条件性地渲染一块内容。这块内容只会在指令的表达式返回 truthy 值的时候被渲染 v-else 可以使用 v-else 指令来表示 v-if 的“else 块” v-else-if 充当 v-if 的“else-if 块”，可以连续使用 用key管理可复用元素 Vue 会尽可能高效地渲染元素，通常会复用已有元素而不是从头开始渲染。这...
2020-04-06 17:38:38
99
原创 初学Vue——part3
计算属性和侦听器 计算属性 内置缓存，即计算所依赖的值未发生改变则不会重新计算 而使用method方法没有computed计算属性高效，因为计算属性有缓存 基础例子： var vm = new Vue({ el: '#example', data: { message: 'Hello' }, computed: { // 计算属性的 getter rever...
2020-03-30 17:15:28
131
1
原创 初学Vue——part 2
实例生命周期钩子 每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数，这给了用户在不同阶段添加自己的代码的机会 生命周期图示 生命周期钩子在不同的阶段被使调用，如beforeCreate、created、beforeMount、mounted、befo...
2020-03-23 21:16:10
111
原创 初学Vue——part 1
Vue采用的开发模式 MVVM模式：面向数据编程 方便操作数据，简化了dom的操作，会减少代码量。 与MVP模式比较：MVP常用于JQuery，面向dom进行开发 Vue中的常见指令 指令 含义 v-bind 绑定 v-if 用于判断 v-for 绑定数组渲染列表 v-on 事件监听 v-model 表单输入与应用状态的双向绑定 指令简写 1.v-on可用...
2020-03-16 17:33:18
141
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人