美文网首页
Vue学习笔记六:Vue语法进阶

Vue学习笔记六:Vue语法进阶

作者: 开发者连小超 | 来源:发表于2019-06-19 16:41 被阅读0次

1.自定义指令directive

这部分官网讲的也比较好理解,可直接查看 https://cn.vuejs.org/v2/guide/custom-directive.html

2.过滤器filter

这部分官网讲的也比较好理解,可直接查看 https://cn.vuejs.org/v2/guide/filters.html#ad

3.$nextTick

针对这个方法的解释,忆小五这篇文章https://www.jianshu.com/p/14ddf618d00b写得比较透彻,可供参考。

4.$set

<template>
  <div class="box">
   count:{{count}} 
    <ul>
        <li v-for="item in arr" :key="item.key">{{item}}</li>
    </ul>
    <button @click="add()">增加</button>
  </div>
</template>
<script>
export default {
  data () {
    return {
      count:1,    
      arr:['aaa','bbb','ccc']
    }
  },
  methods: {
    add() {
      //this.arr[1] = 'ddd' //修改数组中一项,这样不起作用
      this.$set(this.arr,1,'ddd') //修改数组中一项,需要使用$set让Vue监听到
      //this.arr.push('ddd') //数组中添加一项,不需要$setVue也能监听到
      //this.arr.splice(0,1) //数组中删除一项,不需要$setVue也能监听到
    }
  }
}
</script>

相关文章

网友评论

      本文标题:Vue学习笔记六:Vue语法进阶

      本文链接:https://www.haomeiwen.com/subject/zhwkqctx.html