【vue】牛客专题训练
- 1.来源
- 2.Vuex
- 3. watch
- 4.Vue自定义指令钩子函数
-
- 5.v-model修饰符
- 6. 图片懒加载v-lazy
- 7. 双向数据绑定
- 8. ref
1.来源
刷题地址
2.Vuex
- Vuex可以用来管理数据
- Vuex也可以实现组件间的传值
- Vuex的属性有state、mutations、actions、getters、module等
- mutation中的方法按照规定最好不要涉及异步方法
3. watch
答案 打印语句不执行
注意
- watch里面的handler第一次不会执行,如果我们想第一次就执行需要设置immediate:true
- watch方法能执行异步操作
4.Vue自定义指令钩子函数
4.1 钩子函数
自定义指令提供了五个钩子函数,钩子函数是到一定时期会自动执行
5.v-model修饰符
6. 图片懒加载v-lazy
图片是网站优化的一个重点,图片懒加载是其中比较好用的一个方法。vue的图片懒加载插件 ---- vue-lazyload
注意
- img标签中使用懒加载:v-lazy 代替 v-bind:src ;
- 背景图片中使用懒加载:v-lazy:background-image = “” ==>> 注意图片和盒子大小问题,否则显示可能有问题哦。
- 使用时最好给一个 key 属性,即:
<img v-lazy="图片地址" :key="图片地址">
- :key=“” 必须要加,否则就会出现,页面刷新,其他内容都刷新了,但是只有图片不刷新的情况 。因为key可能相同,所以页面不会更新
7. 双向数据绑定
8. ref
Vue 中通过给元素添加哪个属性绑定DOM元素( )
- 给元素添加ref属性,通过this.$refs获取