計算屬性

Question

在knockout.js我能做到以下幾點：

function Person() { 
    this.firstName = ko.observable('Foo') 
    this.lastName = ko.observable('Bar') 
    this.fullName = ko.pureComputed(() => { 
     return this.firstName() + this.lastName() 
    }) 
} 

var p = new Person() 
console.log(p.fullName()) // FooBar 

有什麼辦法在對象上這不是一個組成部分數據Vue公司添加活性計算性能？

Answer 1

在Vue中，您不需要顯式聲明反應性屬性和Knockout需要的方法。一切都只是一個普通的對象。

在Vue中實際使對象生效的是當您通過在該組件的data對象中聲明的屬性將其分配給組件時。

所以在Vue公司的例子也只是：

function Person() { 
    this.firstName = 'Foo'; 
    this.lastName = 'Bar'; 
    this.fullName = function() { 
    return this.firstName + this.lastName; 
    }; 
} 

var p = new Person(); 
console.log(p.fullName()); // FooBar 

如果你使用它的成分裏面，那麼這將是反應性的，就像這樣：

const comp = new Vue({ 
    template: '<div>{{ person.fullName() }}</div>', 
    data: { 
    person: null, 
    }, 
}); 

// Vue detects that p is being assigned to the reactive property 
// 'person' and makes p reactive. 
comp.person = p; 

我應該提，我m不能確定你的意思是「哪些不是Vue中的組件數據」，因爲你首先想要某些東西被動的原因是因爲你希望它在組件的模板和組件中呈現當一個屬性發生變化時會自動重新渲染，所以你不能這麼做從外部對Vue進行計算。

我明白你的問題，如「我如何使Vue產生反應而無需直接在Vue組件的數據或計算屬性中指定它？」。請記住，person屬性必須在組件的data之前爲該屬性（以及分配給它的任何數據）預先聲明爲被動。只要你這樣做，那麼你可以設計你想要的模型對象。