网站建设预算和维护,天商阳光网站邮箱,南昌广告制作有限公司,网站的作用有哪些在用Vue.js做开发的时候#xff0c;一定知道 data, props和computed。用了这么久的Vue就总结一下这个三个东西#xff0c;首先看看官网怎么定义他们#xff0c;https://cn.vuejs.org/v2/api/#data 。
data 是Vue实例的数据对象。Vue将会将data 的属性转换为 getter/setter,…在用Vue.js做开发的时候一定知道 data, props和computed。用了这么久的Vue就总结一下这个三个东西首先看看官网怎么定义他们https://cn.vuejs.org/v2/api/#data 。
data 是Vue实例的数据对象。Vue将会将data 的属性转换为 getter/setter, 也就是用Object.defineProperty方法(在官网里面有深入响应式原理里面具体的介绍)。对象必须是纯粹的对象(含有零个或多个的key/value对)。因为这里面的数据都是被监控的所以说这里面的数据最好都是在视图层显示的数据。如果说不是在视图层展示的变量。可以定义在外面或者放在vm对象上。
例如: let baz export default {data() {return {bar: bar}},methods: {testFn() {// baz}}}bar 变量是在页面中要显示的字段baz就是在函数里面会用到的数据。如果视图里面不用显示的话就没必要写在data里面。这样可以减少开销提高性能。
props 是props 可以是数组或对象用于接收来自父组件的数据。props 可以是简单的数组或者使用对象作为替代
对象允许配置高级选项如类型检测、自定义校验和设置默认值。
computed计算属性将被混入到 Vue 实例中。所有 getter 和 setter 的 this 上下文自动地绑定为 Vue 实例。不过计算属性也用
函数来替代。 computed: {// 仅读取值只须为函数aDouble: function () {return this.a * 2},// 读取和设置aPlus: {get: function () {return this.a 1},set: function (v) {this.a v - 1}}}