开课吧WEB全栈架构师第六期视频教程-vue2.0基础标签

el 不能直接设置为body
1.v-bind绑定属性 可以简写:title="数据+'字符串'" 绑定:src,绑定:href

    
{{name}}

:class class可以为字符串 也可以为数组

    

        {{name}}
        
    

：style="" 可以为字符串 也可以为对象

    

        {{name}}
        
    

2.v-model="" 双向数据绑定 v-model 返回的数据都是字符串

{{name}}

加减法运算

+
=
{{parseInt(n1)+parseInt(n2)}}

加减法简单运算，写在methods中,需要加{{sum()}}

+
=
{{sum()}}

3..v-html 可以解析html v-text 和{{}}插入内容一样
v-text 和{{}}区别：v-text 适用于全部输出，{{}}适用局部输出，但是要配合v-cloak适用

    

        
{{str}}
        

        

    

4.methods 事件 this 代表vm v-on:cliack 简写为 @click methods 中写函数方法

    

        {{a}}
        
    

5.show和if 显示隐藏
v-if： 判断是否加载，可以减轻服务器的压力，在需要时加载。if 控制dom节点
v-show：调整css dispaly属性，可以使客户端操作更加流畅。 show 控制的css
if 可以配合else 使用

    

        
        
111
        
222
    

6.v-for 使用循环的时候，最好把key加上
循环数据

    

        
{{item.name}}
    

循环json

    

        
{{name}}-{{val}}
    

循环字符串

    

        
{{s}}
    

循环数字

    

        
{{i}}
    

7.v-pre 预编译 提高性能 防止意外 不用编译，写的什么直接输出

    

        
{{str}}
    

8.js 会按顺序加载，如果有的没加载出来，则不会继续执行v-cloak 隐藏，数据出来了，则显示 一定要写css

    
    

        
{{str}}
    

9.事件修饰符可以加多个事件，而且没有顺序

stop 禁止冒泡 （冒泡从内到外冒泡 @click.stop）
once 单次事件 只执行一次，但并不影响冒泡
.native 原生的（组件中使用）
.key(keycode|name)（提交留言，或者斜杠出现下拉列表）筛选按键
.keydown
.keydown.enter() =.keydown.13()按回车 执行
.keydown.ctrl.enter()组合键
prevent 阻止默认事件

stop 冒泡、阻止冒泡

once 只发生一次

@keydown.enter/@keydown.13

组合键

.prevent阻止默认跳转事件

self 处理自己的事件（冒泡的不认）

methods 与computed区别

1.计算是没有区别的

computed优势： 变量 
1.具有缓存 性能高，不会自己重新计算，只有修改才会重新计算，
实时计算的，当检测到修改数据的时候，他会把根据这项数据相关的computed 值都计算一遍
2.方便 既可以读也可以写（和变量一样，变量可以出现的地方，他就可以出现）可以包含多个事件
3.属性的形式存在的，（v-model 不可以绑定方法，但是可以绑定变量）
methods 方法
方法只要输出就会重新计算

computed 与methods

{{a}}+{{b}}={{sum}}

computed 读写 get set

    

        姓:
        名: