- 博客(6)
- 收藏
- 关注
RSS订阅原创 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
221
原创 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
1282
原创 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
2903
原创 (接上文)关键词搜索的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
195
原创 记一次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
4293
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人