如何创建具有可观察属性的对象

VueJs How to create object with observable properties

本文关键字:观察 属性 对象 何创建 创建      更新时间:2023-09-26

如何在VueJS中创建knockoutjs ViewModel的等量?例如:

var Person = function() { 
    var self = this;
    this.firstName = ko.observable('');
    this.lastName = ko.observable('');
    this.fullName = ko.computed(
    function() { 
        return self.firstName() + ' ' self.lastName();
    });

在VueJs中等效的是什么?我如何创建一个没有模板属性的对象或视图模型,而不将其创建为组件?我只是创建纯javascript对象(函数/json对象),如果是这样,我怎么能在这些纯javascript对象创建计算/可观察属性?

是的,在Vue中,模型只是一个pojo。计算属性是用它的computed成员建立的。以下是针对您的用例修改的文档中的示例:

var vm = new Vue({
  el: '#aPerson',
  data: {
    firstName: '',
    lastName: ''
  },
  computed: {
    fullName: function () {
      return this.firstName + ' ' + this.lastName;
    }
  }
})

接受person对象的可重用组件应该是这样的:

Vue.component('person', {
  props: ['person'],
  computed: {
    fullName () {
      return this.firstName + ' ' + this.lastName;
    }
  }
});