色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

vue computed 帶參數

錢多多1年前8瀏覽0評論

computed屬性不僅可以直接獲取對象的屬性,并且它可以基于其他數據產生衍生數據并在其內部處理一些邏輯。與json對象的屬性相似,我們也可以為其定義getter和setter方法并在其中添加任何邏輯。Vue的computed屬性通常用于基于某個狀態來生成衍生數據,而不是響應式地監聽某個狀態。

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

在上面的代碼中,我們定義了一個computed的屬性fullName。這個屬性是在data中的firstName和lastName基礎上計算而來的。任何由fullName計算出的屬性都是響應式的,任何對其修改的操作都會觸發UI的更新。

但是在開發中,computed屬性有時需要一些參數來進行計算。在Vue中,輸出一個帶有參數的computed屬性和一個不帶參數的屬性是類似的。在我們的計算屬性中,我們可以以函數的形式提供參數并在其中完成一些邏輯。例如,我們想要在Vue組件中使用帶有參數的computed屬性fullName,如下所示:

var vm = new Vue({
data: {
firstName: 'Tom',
lastName: 'Jerry'
},
computed: {
fullName: function() {
return this.firstName + ' ' + this.lastName;
},
greetings: function() {
return function(name) {
return 'Hello ' + name + ', Welcome!';
}
}
}
})

在上面的代碼中,我們定義了另一個computed屬性greetings,它帶有一個參數name。在該computed屬性中,我們將返回匿名函數,它將接受一個名稱作為參數并返回一個字符串。在這種情況下,我們可以通過計算屬性returnValue來獲取具有參數的計算屬性(通過調用function并傳遞所需的參數)。

{{greetings('Vue')}}

在上面的代碼中,我們將在Vue模板中調用greetings屬性并傳遞字符串'Vue'作為參數。當計算屬性計算完成時,我們將在視圖中看到字符串'Hello Vue, Welcome!'。

總的來說,Vue的computed屬性提供了一個方便的方法來基于其他狀態來計算衍生數據。當computed屬性接收到參數時,我們可以借助computed屬性來完成一些更進一步的邏輯。