![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue.js
阿杗
这个作者很懒,什么都没留下…
展开
-
初学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 阅读 · 0 评论 -
初学vue——part6
表单输入绑定 指令v-model: 你可以用 v-model 指令在表单 <input>、<textarea> 及 <select> 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。 v-model 本质上不过是语法糖。它负责监听用户的输入事件以更新数据,并对一些极端场景进行一些特殊处理。 v-model 在内部为不同的输入元素使用不同的属...原创 2020-04-20 17:29:19 · 108 阅读 · 0 评论 -
初学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 阅读 · 0 评论 -
初学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 阅读 · 0 评论 -
初学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 阅读 · 0 评论 -
初学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 阅读 · 0 评论