Vue中的数据操作(vue数据表)

Vue中的数据操作 数据操作

推荐整理分享Vue中的数据操作(vue数据表)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:vue数据处理方式,vue数据处理方式,vue操作数据库,vue操作数组的方法,vue操作数据库,vue数据表,vue操作数据库,vue数据处理方式,内容如对您有帮助，希望把文章链接给更多的朋友！

1.数据data（属性）：vue实例的数据对象，Vue将会递归，将data的属性转换为getter/setter，从而让data的属性能够相应数据变化。

data:{isHot:true}

2.方法methods：使用methods属性给Vue定义方法，访问data中的数据

methods:{changeWeather(){this.isHot =! this.isHot}}

在方法中访问属性：在methods中访问data的数据，可以通过this.属性名的形式来访问。 示例：例如我们在show方法中，访问number属性，可以直接通过this.number形式访问，其中this就表示vue实例对象。如果在Vue构造外部，可以使用vm.方法名 定义或调用方法，通过vm.$data.属性名来访问data中的属性。

3.计算属性computed：（变量） computed用来监控自己定义的一个变量，进行处理后返回一个结果值。

computed:{info(){return this.isHot ? '炎热': ' 凉爽'}}

4.监视属性：watch

当被监视的属性变化时：回调函数自动调用，进行相关操作。监视的属性必须存在，才能进行监视！！监视的两种写法： （1）.new Vue时传入watch配置watch：{isHot：{handler(newValue,oldValue){console.log('isHot被修改了','newValue,oldValue')}}}(2)通过vm.$watch监视vm.$watch('isHot',{immediate:true, //初始化时让handler调用一下//handler什么时候调用？当isHot发生改变时handler(newValue,oldValue){console.log('isHot被修改了',newValue,oldValue)}})