javascript - vue 計算屬性怎么傳參
問題描述
計算屬性怎么傳參?
<ul> <li v-for='item in goods' : v-text='item.name'></li></ul>data: { goods: [{id: 2,type: 3,name: ’薯片’ },{id: 3,type: 5,name: ’冰紅茶’}]},computed: { goodsType: function(type){switch (type) { case 3:return 'color: #ff9900'break; case 5:return 'color: #00BC0C'break;} }}
問題解答
回答1:傳不了參的,你可以寫成methods
回答2:首先,計算屬性里的方法是傳不了參的,根據(jù)你的代碼我想你想要實現(xiàn)的是根據(jù)type的改變?nèi)シ祷仡伾敲茨銘?yīng)該明白的是計算屬性返回的值只跟它里面的依賴有關(guān),當(dāng)依賴改變的時候就會觸發(fā)計算屬性去重新計算然后改變值,所以你應(yīng)該讓type變成該vm的一個數(shù)據(jù),進(jìn)而成為該計算屬性的依賴。簡單代碼如下:
data: { goods: [], type: 0 //這個type作為你后面計算屬性的依賴項,通過其他方法改變它的值即可。},computed: { goodsType: function(){//這里將會依賴于此vm的type值,當(dāng)type值改變,就會重新計算switch (this.type) { case 3:return 'color: #ff9900'break; case 5:return 'color: #00BC0C'break;} }}回答3:
這個需求用一個對象實例數(shù)據(jù)不就可以解決了嗎?
colors: { 3: ’#ff9900’, 5: ’#00BC0C’}
綁定 style 為 {color: colors[item.type]}
回答4:https://cn.vuejs.org/v2/guide...計算-setter
計算屬性默認(rèn)只有 getter ,不過在需要時你也可以提供一個 setter :
// ...computed: { fullName: { // getter get: function () { return this.firstName + ’ ’ + this.lastName }, // setter set: function (newValue) { var names = newValue.split(’ ’) this.firstName = names[0] this.lastName = names[names.length - 1] } }}// ...
相關(guān)文章:
1. 請教各位大佬,瀏覽器點 提交實例為什么沒有反應(yīng)2. dockerfile - 為什么docker容器啟動不了?3. javascript - 用rem寫的頁面,安卓手機顯示文字是正常的,蘋果顯示的文字是特別小的是為什么呢4. macos - mac下docker如何設(shè)置代理5. javascript - ejs支持if else語法嗎6. javascript - 移動端,當(dāng)出現(xiàn)遮罩層的時候,遮罩層里有div是超出高度scroll的,怎么避免滑動div的時候,body跟隨滑動?7. javascript - webapp業(yè)務(wù)流程基本一致,多套主題(樣式基本不一樣,交互稍有偏差)管理,并且有不斷有新增主題,該如何設(shè)計組件化架構(gòu)?8. javascript - JS設(shè)置Video視頻對象的currentTime時出現(xiàn)了問題,IE,Edge,火狐,都可以設(shè)置,反而chrom卻...9. 新手 - Python 爬蟲 問題 求助10. apache - 本地搭建wordpress權(quán)限問題
