- 博客(7)
- 收藏
- 关注
原创 初学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
270
原创 初学vue——part6
表单输入绑定指令v-model:你可以用 v-model 指令在表单 <input>、<textarea> 及 <select> 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。 v-model 本质上不过是语法糖。它负责监听用户的输入事件以更新数据,并对一些极端场景进行一些特殊处理。v-model 在内部为不同的输入元素使用不同的属...
2020-04-20 17:29:19
159
原创 初学VUE——part5
事件处理事件监听指令:v-onv-on要接收一个需要调用的方法名称。例子:<div id="example-2"> <!-- `greet` 是在下面定义的方法名 --> <button v-on:click="greet">Greet</button></div>var example2 = new Vue({ ...
2020-04-13 18:01:08
161
原创 初学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
153
原创 初学Vue——part3
计算属性和侦听器计算属性内置缓存,即计算所依赖的值未发生改变则不会重新计算而使用method方法没有computed计算属性高效,因为计算属性有缓存基础例子:var vm = new Vue({ el: '#example', data: { message: 'Hello' }, computed: { // 计算属性的 getter rever...
2020-03-30 17:15:28
195
1
原创 初学Vue——part 2
实例生命周期钩子每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数,这给了用户在不同阶段添加自己的代码的机会生命周期图示生命周期钩子在不同的阶段被使调用,如beforeCreate、created、beforeMount、mounted、befo...
2020-03-23 21:16:10
173
原创 初学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
218
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅