vue04

計(jì)算屬性:用來處理復(fù)雜邏輯操作的,在Vue.js中有了計(jì)算屬性這種方法,可以避免在模板中加入過度的業(yè)務(wù)邏輯,保證更好的結(jié)構(gòu)清晰和后期維護(hù)的效率,

例如:<!DOCTYPE html>

<html lang="en">

<head>

? ? <meta charset="UTF-8">

? ? <title>計(jì)算屬性</title>

</head>

<body>

? ? <div class="itany">

? ? ? <button @click='add'>加貨</button>

? ? ? <h1>總價(jià)為:{{total}}</h1>

? ? </div>

? ? <script src='js/vue.js'></script>

? ? <script type="text/javascript">

new Vue({

el:"#itany",

data:{

package1:{count:5,price:3},

package2:{count:8,price:4}

},

computed:{

total:function(){

return this.package1.count*this.package1.price+this.package2.count*this.package2.price

}

},

methods:{

add:function(){

this.package1.count++;

}

}

})

</script>

</body>

</html>

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容