Vue的知识点

    科技2022-07-11  88

    1、Vue本质是个类模板,我们通过传递参数操作实例对象 var  app = new  Vue ({ })

    2、传递的参数包括el,data,methods……通过app.$**来查看

    3、实例中的属性要在data中声明才会被渲染

    4、钩子就是组件的生命周期函数,生命周期即beforeCreated,create,beforeMount,mounted,beforeUpdate,updated,beforeDestory,destoryed它的本质就是特定时间段自动触发的函数

    5、vue使用模板语法插值(文本、原始html v-html、表达式),指令(todo-listo),

    6、vue使用模板语法指令 

    v-model 将数据绑定 

    v-on: == @ 将事件绑定 

    v-for  进行数据的填充

    7、vue的计算属性在于分离模板语法中的复杂逻辑

    计算属性和函数的区别在于缓存

    8、监听属性 watch,我们可以通过 watch 来响应数据的变化  https://www.runoob.com/vue2/vue-watch.html

    9、vue使用的class及style绑定

    class绑定:(需要在style标签中添加css样式)

      <div v-bind:class ="{active:isActive}"></div>

    <div v-bind:class ="[activeClass]"></div>

    style绑定:

    <div v-bind:style ="{color:activeColor}"></div>

    <div v-bind:style ="[baseStyles]"></div>

    注红的需要在data中声明

    10、vue的条件渲染 (v-if,v-else,v-else-if)

    v-if 跟v-show的区别在于v-if是直接删除dom节点,而v-show的dom节点仍然存在只是隐藏了

    11、vue的循环渲染(v-for)

    v-for 默认行为试着不改变整体,而是替换元素。迫使其重新排序的元素,你需要提供一个 key 的特殊属性:

    例如:

    <div v-for="item in items" :key="item.id"> {{ item.text }}</div>

    12、事件处理  https://www.runoob.com/vue2/vue-events.html

     

     

    Processed: 0.024, SQL: 8