Vue简单入门(二)

一、Vue中的属性!

    属性的特性:是否可读可写;是否可被遍历;是否可被删除。

    描述对象来描述这些特性---描述对象的特性都是true

    Object.getOwnPropertyDescriptor(对象,"属性")

        返回描述对象:configurable 是否可被删除

        enumerable 是否可被枚举

        value 对应的值

        writable 是否可被改写

     Object.defineProperty(对象,属性,描述对象)

        定义对象的属性,可以添加新的属性,也可以改变已有的属性

        返回描述对象:writable 是否可被改写 false

        configurable 是否可被删除 false

        enumerable 是否可被枚举 false

    Object.defineProperty(对象,属性,{【存取器 getter/setter】

        get(){return 属性值}  【获取属性值】

        set(newValue){}  【设置属性值】

        enumerable: false,

        configurable: false,

    })

    代理:data中数据在初始化的时候会被内部设置为getter/setter,过程叫做代理

        一开始的时候就要规划好数据,之后再添加新属性的时候,并不会触发视图更新,因为没有被代理

    调用两个方法

        Vue.set(对象,属性,值)

        实例.$set(对象,属性,值)

        数组的方法

        数组的方法是变异方法

    vue中改写了---'push', 'pop', 'shift',  'unshift',  'splice',  'sort',  'reverse'

        数组使用下标改变,不会响应

    表单元素处理

        把数据渲染在input上,用input事件监听变化,改变数据---双向数据绑定

        封装了语法糖,合并了绑定和监听

    指令v-model

    语法:v-model="数据"

    做了两件事情:

        1. 把数据绑在value上

        2. 监听input事件改变数据

二、计算属性!

    模板中不要对数据处理过多的逻辑。

    在模板中对数据处理,可以把逻辑抽离在两个地方:methods方法 & computed计算属性

    methods方法:

        在方法中处理逻辑,最终产生一个结果

    computed计算属性:

        计算属性是一个属性,值是由一个方法执行后的返回值,执行是vue内部处理的

    computed和methods中依赖于data中的值。

    当data中的值更新后,会重新计算,computed只会计算一次,就可以在模板中多次使用。

    data computed methods 属性都会放在实例上

你可能感兴趣的:(Vue简单入门(二))