K60 Pro官方停產(chǎn) 第三方瞬間漲價(jià)
雖然沒有官方宣布，但Redmi的一些高管也已經(jīng)透露了，Redmi K60 Pro已經(jīng)停產(chǎn)且不會補(bǔ)貨，這一切都是為了即將到來的K60 Ultra鋪路，屬于廠家的正常操作。但有意思的是該機(jī)在停產(chǎn)之后
大家好，本篇文章我們繼續(xù)學(xué)習(xí)和 Vue 相關(guān)的內(nèi)容，今天我們歸納總結(jié)下什么是 computed 計(jì)算屬性、如何使用和應(yīng)用場景，以及 computed 和 Method 事件的區(qū)別和應(yīng)用場景。
Vue.js 中的 computed 計(jì)算屬性是一種特殊類型的屬性，它們的值不是簡單地被設(shè)置，而是根據(jù)其它屬性的值計(jì)算得出。
computed 計(jì)算屬性是基于它們的依賴進(jìn)行緩存的，這意味著只有在它們的依賴發(fā)生變化時，才會重新計(jì)算。這使得它們更高效，因?yàn)樗鼈冎辉谛枰獣r才會計(jì)算，而不是每次都調(diào)用。
下面是一個示例，展示了如何使用 computed 計(jì)算屬性:
<template> <div> <p>Full name: {{ fullName }}</p> <input v-model="firstName"> <input v-model="lastName"> </div></template><script>export default { data() { return { firstName: 'John', lastName: 'Doe' } }, computed: { fullName() { return this.firstName + ' ' + this.lastName } }}</script>在這個例子中，當(dāng) firstName 或 lastName 發(fā)生變化時，fullName 會自動重新計(jì)算。
與 computed 計(jì)算屬性不同的是，methods 方法是每次都會調(diào)用的，不能進(jìn)行緩存。如果你需要在每次渲染時都計(jì)算一個值，那么使用 methods 方法會更好。
下面是一個使用 methods 方法的示例：
<template> <div> <p>Full name: {{ getFullName() }}</p> <input v-model="firstName"> <input v-model="lastName"> </div></template><script>export default { data() { return { firstName: 'John', lastName: 'Doe' }}, methods: { getFullName() { return this.firstName + ' ' + this.lastName } }}</script>在這個例子中，每次渲染時都會調(diào)用 getFullName 方法，而不是緩存其結(jié)果。
適用 computed 計(jì)算屬性的場景是:
適用 methods 方法的場景是:
另外，計(jì)算屬性是可以被觀察的，可以被用在指令和計(jì)算屬性依賴中。而 method 方法不能被觀察到,不能用在指令和計(jì)算屬性依賴中。
<template> <div> <p>Price: {{ price }}</p> <p>Discount: {{ discount }}%</p> <p>Discounted price: {{ discountedPrice }}</p> </div></template><script>export default { data() { return { price: 100, discount: 10 } }, computed: { discountedPrice() { return this.price * (1 - this.discount / 100) } }}</script>在這個例子中，discountedPrice 是基于 price 和 discount 計(jì)算得出的，并且當(dāng) price 或 discount 發(fā)生變化時，discountedPrice 會自動重新計(jì)算。 而如果用 method 實(shí)現(xiàn)的話，每次都會計(jì)算一遍，而不是只在需要時計(jì)算。
總之，computed 計(jì)算屬性是一種高效的方式，能夠基于其它屬性進(jìn)行計(jì)算并緩存結(jié)果，而 methods 方法則是每次都會調(diào)用并進(jìn)行計(jì)算。
今天的內(nèi)容就介紹到這里，內(nèi)容比較簡單，希望對你有所幫助。
本文鏈接：http://www.www897cc.com/showinfo-26-41700-0.htmlVue3 學(xué)習(xí)筆記，如何理解 Computed 計(jì)算屬性
聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。郵件：2376512515@qq.com
上一篇： Mongodb和Elasticsearch計(jì)算經(jīng)緯度哪個性能更好
下一篇： Go 語言字符串使用方式與技巧
Copyright ? 2016-2023 天津谷騏科技有限公司 版權(quán)所有 sitemap.xml
違法及侵權(quán)請聯(lián)系：2376512515@qq.com 津ICP備18001702號
津公網(wǎng)安備 12010102000574號