Vue基础知识的补充及扩展

一、表单中的computed计算和watch监听

1、computed：从现有的数据计算出新的数据

computed：{
    "total":function(){
        return xxxx;
    }
}

2、watch监听：监听数据的变化执行回调函数

//数字监听
watch:{
    "num":{
        handler(nval,oval){
            console.log("数据从" + oval + "变为了" + nval);
        }
    }
}
//引用类型监听
watch:{
    "obj":{
        handler(nval, oval) {
            console.log("数据从" + oval + "变为了" + nval);
        },
        deep: true
    }
}

二、Vue中的class类绑定和style样式绑定

1、class类绑定

（1）文本绑定：class=“active”（注意：没有加单引号的active是一个变量，不是字符串）

（2）对象绑定：class=“{‘active’：flag}”

（3）数组绑定：class=“list”

2、style样式绑定

（1）：style=“{color：‘red’，fontSize：‘24px’}”

（2）css属性要用驼峰式写法

三、Vue基础的学习过程中会用到的js知识，在这里回顾一下

1、数组

查找：indexOf（查找对应下标）

删除：shift（前删）、pop（后删）、splice（中间删）

添加：unshift（前加）、push（后加）、splice（也可以添加）

翻转：reverse

转字符串：join

连接数组：concat

高阶：filter（过滤）、forEach（遍历）、map（映射）、reduce（累计）、some（有一个）、every（每一个）、find（查找符合条件的元素）、findIndex（查找符合条件元素的下标）、sort（排序）

2、字符串

indexOf：查询字符串下标，找不到返回-1

split：分割数组

slice（star，end）：切割字符串

subString（star，end）：截取字符串（按下标end）

subStr（star，len）：截取字符串（按长度len）

3、json

eval（）字符串当js执行

JSON.parse（str）：json字符串转换为js对象

JSON.stringify（obj）：js对象转换为json字符串

4、本地存储

setItem（key，value）添加值

getItem（key）获取值

removeItem（key）删除值

clear（）清除