vue基础难点总结（一）

vue指令-v-model修饰符

• 语法:

• • v-model.修饰符="vue数据变量"

• • • .number   以parseFloat转成数字类型
    • .trim          去除首尾空白字符
    • .lazy           在失去焦点时触发更改而非inupt时

计算属性

• 计算属性有缓存，提高渲染性能。
• 如果在页面上需要用到 对现有的数据进行加工得到新数据，则时要使用计算属性

普通写法

computed: {
        //属性名字（计算属性名称）
        //属性的值（计算属性处理函数）
        计算属性名1 () {
            // 对依赖的数据进行处理，且进行return
            return 
        }，

完整写法：

computed: {
    "属性名": {
        set(值){
            
        },
        get() {
            return "值"
        }
    }
}

vue监听器

可以监听数据（data/computed等）的值的改变。 数据的值有类型：基本数据类型，引用数据类型

深度监听：

watch: {
    "要监听的属性名": {
        immediate: true, // 立即执行
        deep: true, // 深度监听复杂类型内变化
        handler (newVal, oldVal) {
            
        }
    }
}

scoped实现组件的私有样式：

<stype scoped>
  h2 {} // 样式只会在当前组件内生效
</style>

父传子

 

子传父