Rumah > Soal Jawab > teks badan
Bagaimana untuk lulus parameter untuk atribut yang dikira?
<ul>
<li v-for="item in goods" :style="goodsType" 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;
}
}
}
phpcn_u15822017-07-05 10:49:14
Jika parameter tidak dapat dilalui, anda boleh menulisnya sebagai kaedah
phpcn_u15822017-07-05 10:49:14
Pertama sekali, kaedah dalam atribut yang dikira tidak boleh melepasi parameter Menurut kod anda, saya fikir apa yang anda ingin capai adalah untuk mengembalikan warna mengikut perubahan jenis Kemudian anda harus memahami bahawa nilai yang dikembalikan oleh yang dikira atribut hanya berkaitan dengan nilai di dalamnya Ketergantungan adalah berkaitan Apabila kebergantungan berubah, sifat yang dikira akan dicetuskan untuk mengira semula dan kemudian menukar nilai, jadi anda harus membuat taip data vm, dan kemudian menjadi kebergantungan. harta yang dikira. Kod mudah adalah seperti berikut:
data: {
goods: [],
type: 0 //这个type作为你后面计算属性的依赖项,通过其他方法改变它的值即可。
},
computed: {
goodsType: function(){
//这里将会依赖于此vm的type值,当type值改变,就会重新计算
switch (this.type) {
case 3:
return "color: #ff9900"
break;
case 5:
return "color: #00BC0C"
break;
}
}
}
大家讲道理2017-07-05 10:49:14
Tidakkah keperluan ini boleh diselesaikan dengan data tika objek?
colors: {
3: '#ff9900',
5: '#00BC0C'
}
Ikat gaya kepada {color: colors[item.type]}
过去多啦不再A梦2017-07-05 10:49:14
https://cn.vuejs.org/v2/guide... penetap-pengiraan
Sifat yang dikira hanya mempunyai pengambil secara lalai, tetapi anda juga boleh menyediakan penetap apabila diperlukan:
// ...
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]
}
}
}
// ...