![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
菜鸡成长日记
苦逼程序员 在校大学生
展开
-
【vue学习记录】数据与方法
当一个 Vue 实例被创建时,它向 Vue 的响应式系统中加入了其 data 对象中能找到的所有的属性。当这些属性的值发生改变时,视图将会产生“响应”,即匹配更新为新的值。// 我们的数据对象var data = { a: 1 }// 该对象被加入到一个 Vue 实例中var vm = new Vue({data: data})// 获得这个实例上的属性// 返回源数据中对应的字段...转载 2019-07-18 09:43:59 · 148 阅读 · 0 评论 -
【Vue记录】生命周期钩子函数与箭头函数
不要在选项属性或回调上使用箭头函数比如 created: () => console.log(this.a) 或 vm.$watch(‘a’, newValue => this.myMethod())因为箭头函数是和父级上下文绑定在一起的,this 不会是如你所预期的 Vue 实例,经常导致 Uncaught TypeError: Cannot read property of u...转载 2019-07-18 10:02:09 · 1051 阅读 · 0 评论 -
【Vue记录】v-if&v-show
v-if 是“真正”的条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。v-if 也是惰性的:如果在初始渲染时条件为假,则什么也不做——直到条件第一次变为真时,才会开始渲染条件块。相比之下,v-show 就简单得多——不管初始条件是什么,元素总是会被渲染,并且只是简单地基于 CSS 进行切换。一般来说,v-if 有更高的切换开销,而 v-show 有更高的初始...转载 2019-07-18 14:39:48 · 85 阅读 · 0 评论 -
【Vue记录】事件修饰符
在事件处理程序中调用 event.preventDefault() 或 event.stopPropagation() 是非常常见的需求。尽管我们可以在方法中轻松实现这点,但更好的方式是:方法只有纯粹的数据逻辑,而不是去处理 DOM 事件细节。为了解决这个问题,Vue.js 为 v-on 提供了事件修饰符。之前提过,修饰符是由点开头的指令后缀来表示的。.stop.prevent.captu...转载 2019-07-18 15:59:39 · 176 阅读 · 0 评论 -
【Vue记录】为什么在 HTML 中监听事件?
你可能注意到这种事件监听的方式违背了关注点分离 (separation of concern) 这个长期以来的优良传统。但不必担心,因为所有的 Vue.js 事件处理方法和表达式都严格绑定在当前视图的 ViewModel 上,它不会导致任何维护上的困难。实际上,使用 v-on 有几个好处:扫一眼 HTML 模板便能轻松定位在 JavaScript 代码里对应的方法。因为你无须在 JavaScr...转载 2019-07-18 16:10:13 · 164 阅读 · 0 评论