Vue2.5入门知识点

挂载点: Vue实例只处理挂载点下面的内容

模板挂载点内部的内容都称之为模板模板可以放在挂载点里面,也可以放在实例中的template属性中。


语法
{{插值表达式}}
v-text=“变量,会转义”,v-html=“不会转义”

事件绑定:v-on:click=”函数or函数名” 可缩写@click

属性绑定:v-bind:属性=”数据项(data中的)” 可缩写为 :属性
双向数据绑定:v-model=”数据项”

计算属性:放在computed:{}里
好处:所需数据没改变的时候,计算属性会使用上次的缓存值,只会重新渲染所需数据。

侦听器:watch:{}


常见指令:

v-if:会操控DOM
v-show:不会清除DOM只负责display:none

v-for
用法:v-for=”(item, index) of list” :key=”index”
注意:要写key


组件

全局组件

Vue.component('todo-item', {
    template: '
  • item
  • ' })

    局部组件

    var TodoItem = {
        template: '
  • item
  • ' }

    注意:直接在父组件当中调用子组件是无法调用的!
    解决

    在Vue实例当中通过components:{
        'todo-item': TodoItem
    }注册
    

    在局部组件当中,props:值可以是数组 例如:[‘属性’,] 作用是接收从外部传递过来的属性
    注意:props一定要写在局部组件里面!!!!


    所以说啊,每一个组件其实都是一个实例


    父子组件传值(重点敲黑板!):

    父组件通过属性的形势向子组件传递数据,
    子组件通过发布订阅的形势向父组件传递数据。

    this.$emit(’ 函数’,可以写参数)
    作用:触发自定义函数

    你可能感兴趣的:(Vue.js)