前端-vue

  1. el 绑定vue对象跟控件

  2. v-if v-for

  3. v-model 处理用户输入，双向绑定

  4. 组件化：相当于自定义控件，如下声明了一个“todo-item”的控件，有“todo”的属相。

    1
    2
    3
    4
    Vue.component('todo-item',{
    	props:['todo'],   //相当于自定义的属相
    	template:'<li>{{todo.text}}</li>' //代码模板
    })

  1. data：vue对象被创建的时候，会吧data中所有的属相放入响应式系统中，当值发生变化的时候，视图会做出“相应”

  2. $: 

    1
    2
    3
    4
    vm$data  ==  vm对象中的data
    vm$el  == vm对象中的el
    vm$watch
    ...

  3. hook 生命周期，注意this的使用，在箭头函数中，this不代表vue实例。

    1. created
    2. mounted
    3. updated
    4. destroyed

  4. v-html 显示html

  5. v-bind 绑定控件的属相，缩写是“：”。如下绑定div的class属相 

    1
    2
    3
    4
    <div v-bind:class="color">
    </div>

    <a v-bind:href="url"></a>

  6. v-on 绑定事件，缩写是“@”。如下绑定a的点击事件

    1
    <a v-on:click="clickA"></a>

  1. xxx 支持js表达式