
vue
文章平均质量分 82
My-Lady
这个作者很懒,什么都没留下…
展开
-
vue组件之间的通信以及如何在父组件中调用子组件的方法和属性
在Vue中组件实例之间的作用域是孤立的,以为不能直接在子组件上引用父组件的数据,同时父组件也不能直接使用子组件的数据一、父组件利用props往子组件传输数据父组件: //注意传递参数时要用—代替驼峰命名,HTML不区分大小写子组件:Vue.component('child', { // camelCase in JavaScript props:{myMessage}原创 2017-08-18 09:44:54 · 2687 阅读 · 0 评论 -
【学习笔记】vue-router路由的两种实现机制
【源码拾遗】从vue-router看前端路由的两种实现 【源码拾遗】从vue-router看前端路由的两种实现 本文由浅入深观摩vue-router源码是如何通过hash与History interface两种方式实现前端路由,介绍了相关原理,并对比了两种方式的优缺点与注意事项。最后分析了如何实现可以直接从文件系统加载而不借助后端服务器的Vue单页应用。随着前端应用的业务功能越来越复杂、转载 2017-08-20 17:23:45 · 2368 阅读 · 0 评论 -
Vue中过度动画效果应用
一、实现动画过渡效果的几种方式实现动画必须要将要进行动画的元素利用标签进行包裹1、利用CSS样式实现过渡效果 v-enter: 定义进入过渡的开始状态。在元素被插入时生效,在下一个帧移除。v-enter-active: 定义过渡的状态。在元素整个过渡过程中作用,在元素被插入时生效,在 transition/animation 完成之后移除。 这个类可以被用来定义过渡的过程时间,延原创 2017-08-18 09:44:49 · 2754 阅读 · 0 评论 -
Vue实现双向绑定的原理以及响应式数据
一、vue中的响应式属性 Vue中的数据实现响应式绑定 1、对象实现响应式: 是在初始化的时候利用definePrototype的定义set和get过滤器,在进行组件模板编译时实现water的监听搜集依赖项,当数据发生变化时在set中通过调用dep.notify进行发布通知,实现视图的更新。 2、数组实现响应式: 对于数组则是通过继承重写数组的方法splice、po原创 2017-08-18 09:44:39 · 874 阅读 · 0 评论 -
【学习笔记】Vue中实现双向数据绑定的原理
在实现双向数据绑定的方法中主要有如下几种方式: (1)发布订阅者模式(backbone.js) (2)脏检查(angular.js) (3)数据劫持 在vue中是结合了(1)和(3)两种方式来实现的,主要通过Object.defineProperty()方式进行数据劫持,然后订阅发布者模式监测数据的变化并进行广播。 可以参考下面的文章:文章里介绍的比较详细下面附上自己实现的代码:<!DOC原创 2017-08-25 22:23:30 · 1732 阅读 · 0 评论 -
【学习笔记】Vue响应式原理
一、vue中的响应式属性Vue中的数据实现响应式绑定1、对象实现响应式: 是在初始化的时候利用definePrototype的定义set和get过滤器,在进行组件模板编译时实现water的监听搜集依赖项,当数据发生变化时在set中通过调用dep.notify进行发布通知,实现视图的更新。2、数组实现响应式:对于数组则是通过继承重写数组的方法splice、pop、push、shift、unshift原创 2017-08-25 22:40:13 · 401 阅读 · 0 评论