- 博客(6)
- 收藏
- 关注
原创 Vue的directives对象定义新指令
需求需求1:定义一个v-big指令,和v-text类似,但会把值放大10倍需求2:定义一个v-fbind指令,和v-bind类似,但可以让其绑定的input元素默认获取焦点实现实现功能1在data中定义n,赋值1<h2> 现在的N值是: <span v-text="n"></span> </h2> <h2> 放大10倍的N值是: <span v-big="n"></span>
2022-03-23 08:48:25
224
原创 Vue中直接操作数组索引不奏效的解释
1.案例我们首先创造一个数组hobby并展示data:{hobby:["抽烟" , "喝酒" , "烫头"]}<ul> <li v-for="(item , index) in hobby">{{item}}</li></ul>此时,我们在控制台操作修改该数组vm.hobby[0] = "运动"会发现此时数组确实已经修改,但页面内容并没有改变2.解释我们知道,Vue会对每一个data中的对象创建getter和setter方法,来
2022-03-20 15:04:24
1288
原创 Vue.set()和vm.$set()方法及不足
什么时候要使用?官方文档解释:Vue 无法检测 property 的添加或移除。由于 Vue 会在初始化实例时对 property 执行 getter/setter转化,所以 property 必须在 data 对象上存在才能让 Vue 将它转换为响应式的。例如:var vm = new Vue({ data:{ a:1 }})// `vm.a` 是响应式的vm.b = 2// `vm.b` 是非响应式的对于已经创建的实例,Vue 不允许动态添加根级别的响应式
2022-03-20 14:22:00
2908
原创 (接上文)关键词搜索的computed实现
WATCH实现代码 watch:{ keyWord:{ immediate: true, handler(val){ this.filPerson = this.person.filter((p) => { return p.name.indexOf(val) !== -1 }) } } }COMPUTED实现代码 computed:{
2022-03-19 18:30:34
197
原创 记一次Vue实现关键词搜索的过程(watch实现)
目的现有一个长度为4的对象数组person:[ {id:'001', name:'马冬梅', age:18, sex:'女'}, {id:'002', name:'周冬雨', age:19, sex:'女'}, {id:'003', name:'周杰伦', age:20, sex:'男'}, {id:'004', name:'温兆伦', age:20, sex:'男'}, ]上方有一个关键词输入框input输入名字中的关键
2022-03-19 12:30:03
4296
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅
1