Vue 过滤器、计算属性、侦听器 图解版 一目了然
文章目錄
- 本篇學(xué)習(xí)目標(biāo)
- 1. vue基礎(chǔ)
- 1.0_vue基礎(chǔ) v-for更新監(jiān)測
- 1.1_vue基礎(chǔ)_v-for就地更新
- 1.2_vue基礎(chǔ)_虛擬dom
- 1.3_vue基礎(chǔ)_diff算法
- 情況1: 根元素變了, 刪除重建
- 情況2: 根元素沒變, 屬性改變, ==元素復(fù)用==, 更新屬性
- 1.4_vue基礎(chǔ)_diff算法-key
- 情況3: 根元素沒變, 子元素沒變, 元素內(nèi)容改變
- 無key - 就地更新
- 有key - 值為索引
- 有key - 值為id
- 1.5_階段小結(jié)
- 1.6_vue基礎(chǔ) 動態(tài)class
- 1.7_vue基礎(chǔ)-動態(tài)style
- 2. vue過濾器
- 2.0_vue過濾器-定義使用
- 2.1_vue過濾器-傳參和多過濾器
- 2.2_案例-品牌管理(時間格式化)
- 3. vue計(jì)算屬性
- 3.0_vue計(jì)算屬性-computed
- 3.1_vue計(jì)算屬性-緩存
- 3.2_案例-品牌管理(總價和均價)
- 3.3_vue計(jì)算屬性-完整寫法
- 3.4_案例-小選影響全選
- 3.5_案例-全選影響小選
- 3.6_案例-反選
- 4. vue偵聽器
- 4.0_vue偵聽器-watch
- 4.1_vue偵聽器-深度偵聽和立即執(zhí)行
- 4.2_案例-品牌管理(數(shù)據(jù)緩存)
- 今日總結(jié)
- 面試題
- 1. Vue 中怎么自定義過濾器
- 2. Vue中:key作用, 為什么不能用索引
- 3. 數(shù)組更新有的時候v-for不渲染
- 寫在最后
本篇學(xué)習(xí)目標(biāo)
1. vue基礎(chǔ)
1.0_vue基礎(chǔ) v-for更新監(jiān)測
目標(biāo): 當(dāng)v-for遍歷的目標(biāo)結(jié)構(gòu)改變, Vue觸發(fā)v-for的更新
情況1: 數(shù)組翻轉(zhuǎn)
情況2: 數(shù)組截取
情況3: 更新值
口訣:
數(shù)組變更方法, 就會導(dǎo)致v-for更新, 頁面更新
數(shù)組非變更方法, 返回新數(shù)組, 就不會導(dǎo)致v-for更新, 可采用覆蓋數(shù)組或this.$set()
<template><div><ul><li v-for="(val, index) in arr" :key="index">{{ val }}</li></ul><button @click="revBtn">數(shù)組翻轉(zhuǎn)</button><button @click="sliceBtn">截取前3個</button><button @click="updateBtn">更新第一個元素值</button></div> </template><script> export default {data(){return {arr: [5, 3, 9, 2, 1]}},methods: {revBtn(){// 1. 數(shù)組翻轉(zhuǎn)可以讓v-for更新this.arr.reverse()},sliceBtn(){// 2. 數(shù)組slice方法不會造成v-for更新// slice不會改變原始數(shù)組// this.arr.slice(0, 3)// 解決v-for更新 - 覆蓋原始數(shù)組let newArr = this.arr.slice(0, 3)this.arr = newArr},updateBtn(){// 3. 更新某個值的時候, v-for是監(jiān)測不到的// this.arr[0] = 1000;// 解決-this.$set()// 參數(shù)1: 更新目標(biāo)結(jié)構(gòu)// 參數(shù)2: 更新位置// 參數(shù)3: 更新值this.$set(this.arr, 0, 1000)}} } </script><style></style>這些方法會觸發(fā)數(shù)組改變, v-for會監(jiān)測到并更新頁面
- push()
- pop()
- shift()
- unshift()
- splice()
- sort()
- reverse()
這些方法不會觸發(fā)v-for更新
- slice()
- filter()
- concat()
注意: vue不能監(jiān)測到數(shù)組里賦值的動作而更新, 如果需要請使用Vue.set() 或者this.$set(), 或者覆蓋整個數(shù)組
總結(jié): 改變原數(shù)組的方法才能讓v-for更新
1.1_vue基礎(chǔ)_v-for就地更新
v-for 的默認(rèn)行為會嘗試原地修改元素而不是移動它們。
詳解v-for就地更新流程(可以看ppt動畫)
這種 虛擬DOM對比方式, 可以提高性能 - 但是還不夠高
1.2_vue基礎(chǔ)_虛擬dom
目標(biāo): 了解虛擬DOM的概念
.vue文件中的template里寫的標(biāo)簽, 都是模板, 都要被vue處理成虛擬DOM對象, 才會渲染顯示到真實(shí)DOM頁面上
內(nèi)存中生成一樣的虛擬DOM結(jié)構(gòu)(本質(zhì)是個JS對象)
因?yàn)檎鎸?shí)的DOM屬性好幾百個, 沒辦法快速的知道哪個屬性改變了
比如template里標(biāo)簽結(jié)構(gòu)
<template><div id="box"><p class="my_p">123</p></div> </template>對應(yīng)的虛擬DOM結(jié)構(gòu)
const dom = {type: 'div',attributes: [{id: 'box'}],children: {type: 'p',attributes: [{class: 'my_p'}],text: '123'} }以后vue數(shù)據(jù)更新
- 生成新的虛擬DOM結(jié)構(gòu)
- 和舊的虛擬DOM結(jié)構(gòu)對比
- 利用diff算法, 找不不同, 只更新變化的部分(重繪/回流)到頁面 - 也叫打補(bǔ)丁
好處1: 提高了更新DOM的性能(不用把頁面全刪除重新渲染)
好處2: 虛擬DOM只包含必要的屬性(沒有真實(shí)DOM上百個屬性)
總結(jié): 虛擬DOM保存在內(nèi)存中, 只記錄dom關(guān)鍵信息, 配合diff算法提高DOM更新的性能
在內(nèi)存中比較差異, 然后給真實(shí)DOM打補(bǔ)丁更新上
1.3_vue基礎(chǔ)_diff算法
vue用diff算法, 新虛擬dom, 和舊的虛擬dom比較
情況1: 根元素變了, 刪除重建
舊虛擬DOM
<div id="box"><p class="my_p">123</p> </div>新虛擬DOM
<ul id="box"><li class="my_p">123</li> </ul>情況2: 根元素沒變, 屬性改變, 元素復(fù)用, 更新屬性
舊虛擬DOM
<div id="box"><p class="my_p">123</p> </div>新虛擬DOM
<div id="myBox" title="標(biāo)題"><p class="my_p">123</p> </div>1.4_vue基礎(chǔ)_diff算法-key
情況3: 根元素沒變, 子元素沒變, 元素內(nèi)容改變
無key - 就地更新
v-for不會移動DOM, 而是嘗試復(fù)用, 就地更新,如果需要v-for移動DOM, 你需要用特殊 attribute key 來提供一個排序提示
<ul id="myUL"><li v-for="str in arr">{{ str }} <input type="text"></li> </ul> <button @click="addFn">下標(biāo)為1的位置新增一個</button> export default {data(){return {arr: ["老大", "新來的", "老二", "老三"]}},methods: {addFn(){this.arr.splice(1, 0, '新來的')}} };舊 - 虛擬DOM結(jié)構(gòu) 和 新 - 虛擬DOM結(jié)構(gòu) 對比過程
性能不高, 從第二個li往后都更新了
有key - 值為索引
- 還是就地更新
因?yàn)樾屡f虛擬DOM對比, key存在就復(fù)用此標(biāo)簽更新內(nèi)容, 如果不存在就直接建立一個新的
<ul id="myUL"><li v-for="(str, index) in arr" :key="index">{{ str }} <input type="text"></li> </ul> <button @click="addFn">下標(biāo)為1的位置新增一個</button> export default {data(){return {arr: ["老大", "新來的", "老二", "老三"]}},methods: {addFn(){this.arr.splice(1, 0, '新來的')}} };key為索引-圖解過程 (又就地往后更新了)
v-for先循環(huán)產(chǎn)生新的DOM結(jié)構(gòu), key是連續(xù)的, 和數(shù)據(jù)對應(yīng)
然后比較新舊DOM結(jié)構(gòu), 找到區(qū)別, 打補(bǔ)丁到頁面上
最后補(bǔ)一個li, 然后從第二個往后, 都要更新內(nèi)容
口訣: key的值有id用id, 沒id用索引
有key - 值為id
key的值只能是唯一不重復(fù)的, 字符串或數(shù)值
v-for不會移動DOM, 而是嘗試復(fù)用, 就地更新,如果需要v-for移動DOM, 你需要用特殊 attribute key 來提供一個排序提示
新DOM里數(shù)據(jù)的key存在, 去舊的虛擬DOM結(jié)構(gòu)里找到key標(biāo)記的標(biāo)簽, 復(fù)用標(biāo)簽
新DOM里數(shù)據(jù)的key存在, 去舊的虛擬DOM結(jié)構(gòu)里沒有找到key標(biāo)簽的標(biāo)簽, 創(chuàng)建
舊DOM結(jié)構(gòu)的key, 在新的DOM結(jié)構(gòu)里沒有了, 則移除key所在的標(biāo)簽
<template><div><ul><li v-for="obj in arr" :key="obj.id">{{ obj.name }}<input type="text"></li></ul><button @click="btn">下標(biāo)1位置插入新來的</button></div> </template><script> export default {data() {return {arr: [{name: '老大',id: 50},{name: '老二',id: 31},{name: '老三',id: 10}],};},methods: {btn(){this.arr.splice(1, 0, {id: 19, name: '新來的'})}} }; </script><style> </style>圖解效果:
總結(jié): 不用key也不影響功能(就地更新), 添加key可以提高更新的性能
1.5_階段小結(jié)
v-for什么時候會更新頁面呢?
- 數(shù)組采用更新方法, 才導(dǎo)致v-for更新頁面
vue是如何提高更新性能的?
- 采用虛擬DOM+diff算法提高更新性能
虛擬DOM是什么?
- 本質(zhì)是保存dom關(guān)鍵信息的JS對象
diff算法如何比較新舊虛擬DOM?
- 根元素改變 – 刪除當(dāng)前DOM樹重新建
- 根元素未變, 屬性改變 – 更新屬性
- 根元素未變, 子元素/內(nèi)容改變
- 無key – 就地更新 / 有key – 按key比較
1.6_vue基礎(chǔ) 動態(tài)class
目標(biāo): 用v-bind給標(biāo)簽class設(shè)置動態(tài)的值
- 語法:
- :class="{類名: 布爾值}"
總結(jié): 就是把類名保存在vue變量中賦予給標(biāo)簽
1.7_vue基礎(chǔ)-動態(tài)style
目標(biāo): 給標(biāo)簽動態(tài)設(shè)置style的值
- 語法
- :style="{css屬性: 值}"
總結(jié): 動態(tài)style的key都是css屬性名
2. vue過濾器
2.0_vue過濾器-定義使用
目的: 轉(zhuǎn)換格式, 過濾器就是一個函數(shù), 傳入值返回處理后的值
過濾器只能用在, 插值表達(dá)式和v-bind表達(dá)式
Vue中的過濾器場景
- 字母轉(zhuǎn)大寫, 輸入"hello", 輸出"HELLO"
- 字符串翻轉(zhuǎn), “輸入hello, world”, 輸出"dlrow ,olleh"
語法:
-
Vue.filter(“過濾器名”, (值) => {return “返回處理后的值”})
-
filters: {過濾器名字: (值) => {return “返回處理后的值”}
例子:
- 全局定義字母都大寫的過濾器
- 局部定義字符串翻轉(zhuǎn)的過濾器
總結(jié): 把值轉(zhuǎn)成另一種形式, 使用過濾器, Vue3用函數(shù)替代了過濾器.
全局注冊最好在main.js中注冊, 一處注冊到處使用
2.1_vue過濾器-傳參和多過濾器
目標(biāo): 可同時使用多個過濾器, 或者給過濾器傳參
- 語法:
- 過濾器傳參: vue變量 | 過濾器(實(shí)參)
- 多個過濾器: vue變量 | 過濾器1 | 過濾器2
總結(jié): 過濾器可以傳參, 還可以對某個過濾器結(jié)果, 后面在使用一個過濾器
2.2_案例-品牌管理(時間格式化)
目標(biāo): 復(fù)制上個案例, 在此基礎(chǔ)上, 把表格里的時間用過濾器+moment模塊, 格式化成YYYY-MM-DD 格式
圖示:
下載moment處理日期的第三方工具模塊
moment官網(wǎng)文檔: http://momentjs.cn/docs/#/displaying/
yarn add moment定義過濾器, 把時間用moment模塊格式化, 返回我們想要的格式
// 目標(biāo): 處理時間 // 1. 下載moment模塊 import moment from 'moment'// 2. 定義過濾器, 編寫內(nèi)部代碼 filters: { formatDate (val){return moment(val).format('YYYY-MM-DD')} }<!-- 3. 使用過濾器 --> <td>{{ obj.time | formatDate }}</td>3. vue計(jì)算屬性
3.0_vue計(jì)算屬性-computed
目標(biāo): 一個數(shù)據(jù), 依賴另外一些數(shù)據(jù)計(jì)算而來的結(jié)果
語法:
- computed: {"計(jì)算屬性名" () {return "值"} }
需求:
- 需求: 求2個數(shù)的和顯示到頁面上
注意: 計(jì)算屬性也是vue數(shù)據(jù)變量, 所以不要和data里重名, 用法和data相同
總結(jié): 一個數(shù)據(jù), 依賴另外一些數(shù)據(jù)計(jì)算而來的結(jié)果
3.1_vue計(jì)算屬性-緩存
目標(biāo): 計(jì)算屬性是基于它們的依賴項(xiàng)的值結(jié)果進(jìn)行緩存的,只要依賴的變量不變, 都直接從緩存取結(jié)果
總結(jié): 計(jì)算屬性根據(jù)依賴變量結(jié)果緩存, 依賴變化重新計(jì)算結(jié)果存入緩存, 比普通方法性能更高
3.2_案例-品牌管理(總價和均價)
目標(biāo): 基于之前的案例, 完成總價和均價的計(jì)算效果
此處只修改了變化的代碼
<tr style="background-color: #EEE"><td>統(tǒng)計(jì):</td><td colspan="2">總價錢為: {{ allPrice }}</td><td colspan="2">平均價: {{ svgPrice }}</td> </tr><script> // 目標(biāo): 總價和均價顯示 // 1. 末尾補(bǔ)tr - 顯示總價和均價 export default {// ...源代碼省略// 2. 計(jì)算屬性computed: {allPrice(){// 3. 求總價return this.list.reduce((sum, obj) => sum += obj.price, 0)},avgPrice(){// 4. 求均價 - 保留2位小數(shù)return (this.allPrice / this.list.length).toFixed(2)}} } </script>總結(jié): 總價來源于所有數(shù)據(jù)計(jì)算而來的結(jié)果, 故采用計(jì)算屬性
3.3_vue計(jì)算屬性-完整寫法
目標(biāo): 計(jì)算屬性也是變量, 如果想要直接賦值, 需要使用完整寫法
語法:
computed: {"屬性名": {set(值){},get() {return "值"}} }需求:
- 計(jì)算屬性給v-model使用
頁面準(zhǔn)備輸入框
<template><div><div><span>姓名:</span><input type="text" v-model="full"></div></div> </template><script> // 問題: 給計(jì)算屬性賦值 - 需要setter // 解決: /*完整語法:computed: {"計(jì)算屬性名" (){},"計(jì)算屬性名": {set(值){},get(){return 值}}} */ export default {computed: {full: {// 給full賦值觸發(fā)set方法set(val){console.log(val)},// 使用full的值觸發(fā)get方法get(){return "無名氏"}}} } </script><style></style>總結(jié): 想要給計(jì)算屬性賦值, 需要使用set方法
3.4_案例-小選影響全選
目標(biāo): 小選框都選中(手選), 全選自動選中
- 需求: 小選框都選中(手選), 全選自動選中
分析:
① 先靜態(tài)后動態(tài), 從.md拿到靜態(tài)標(biāo)簽和數(shù)據(jù)
② 循環(huán)生成復(fù)選框和文字, 對象的c屬性和小選框的選中狀態(tài), 用v-model雙向綁定
③ 定義isAll計(jì)算屬性, 值通過小選框們統(tǒng)計(jì)c屬性狀態(tài)得來
圖示:
模板標(biāo)簽和數(shù)據(jù)(直接復(fù)制在這基礎(chǔ)上寫vue代碼)
<template><div><span>全選:</span><input type="checkbox"/><button>反選</button><ul><li><input type="checkbox"/><span>任務(wù)名</span></li></ul></div> </template><script> export default {data() {return {arr: [{name: "豬八戒",c: false,},{name: "孫悟空",c: false,},{name: "唐僧",c: false,},{name: "白龍馬",c: false,},],};} }; </script>正確代碼,不可復(fù)制
<template><div><span>全選:</span><!-- 4. v-model 關(guān)聯(lián)全選 - 選中狀態(tài) --><input type="checkbox" v-model="isAll"/><button>反選</button><ul><li v-for="(obj, index) in arr" :key="index"><!-- 3. 對象.c - 關(guān)聯(lián) 選中狀態(tài) --><input type="checkbox" v-model="obj.c"/><span>{{ obj.name }}</span></li></ul></div> </template><script> // 目標(biāo): 小選框 -> 全選 // 1. 標(biāo)簽+樣式+js準(zhǔn)備好 // 2. 把數(shù)據(jù)循環(huán)展示到頁面上 export default {data() {return {arr: [{name: "豬八戒",c: false,},{name: "孫悟空",c: false,},{name: "唐僧",c: false,},{name: "白龍馬",c: false,},],};},// 5. 計(jì)算屬性-isAllcomputed: {isAll () {// 6. 統(tǒng)計(jì)小選框狀態(tài) -> 全選狀態(tài)// every口訣: 查找數(shù)組里"不符合"條件, 直接原地返回falsereturn this.arr.every(obj => obj.c === true)}} }; </script>3.5_案例-全選影響小選
目標(biāo): 全選影響小選
- 需求1: 獲取到全選狀態(tài) – 改裝isAll計(jì)算屬性
- 需求2: 全選狀態(tài)同步給所有小選框
分析:
①: isAll改成完整寫法, set里獲取到全選框, 勾選的狀態(tài)值
②: 遍歷數(shù)據(jù)數(shù)組, 賦給所有小選框v-model關(guān)聯(lián)的屬性
圖示:
正確代碼,不可以復(fù)制
<script> export default {// ...其他代碼// 5. 計(jì)算屬性-isAllcomputed: {isAll: {set(val){// 7. 全選框 - 選中狀態(tài)(true/false)this.arr.forEach(obj => obj.c = val)},get(){// 6. 統(tǒng)計(jì)小選框狀態(tài) -> 全選狀態(tài)// every口訣: 查找數(shù)組里"不符合"條件, 直接原地返回falsereturn this.arr.every(obj => obj.c === true)}}} }; </script>3.6_案例-反選
目標(biāo): 反選功能
- 需求: 點(diǎn)擊反選, 讓所有小選框, 各自取相反勾選狀態(tài)
分析:
①: 小選框的勾選狀態(tài), 在對象的c屬性
②: 遍歷所有對象, 把對象的c屬性取相反值賦予回去即可
圖示:
正確代碼,不可以復(fù)制
<button @click="btn">反選</button><script> export default {// ...其他代碼省略methods: {btn(){// 8. 讓數(shù)組里對象的c屬性取反再賦予回去this.arr.forEach(obj => obj.c = !obj.c)}} }; </script>4. vue偵聽器
4.0_vue偵聽器-watch
目標(biāo): 可以偵聽data/computed屬性值改變
語法:
- watch: {"被偵聽的屬性名" (newVal, oldVal){} }
完整例子代碼:
<template><div><input type="text" v-model="name"></div> </template><script> export default {data(){return {name: ""}},// 目標(biāo): 偵聽到name值的改變/*語法:watch: {變量名 (newVal, oldVal){// 變量名對應(yīng)值改變這里自動觸發(fā)}}*/watch: {// newVal: 當(dāng)前最新值// oldVal: 上一刻值name(newVal, oldVal){console.log(newVal, oldVal);}} } </script><style></style>總結(jié): 想要偵聽一個屬性變化, 可使用偵聽屬性watch
4.1_vue偵聽器-深度偵聽和立即執(zhí)行
目標(biāo): 偵聽復(fù)雜類型, 或者立即執(zhí)行偵聽函數(shù)
-
語法:
watch: {"要偵聽的屬性名": {immediate: true, // 立即執(zhí)行deep: true, // 深度偵聽復(fù)雜類型內(nèi)變化handler (newVal, oldVal) {}} }
完整例子代碼:
<template><div><input type="text" v-model="user.name"><input type="text" v-model="user.age"></div> </template><script> export default {data(){return {user: {name: "",age: 0}}},// 目標(biāo): 偵聽對象/*語法:watch: {變量名 (newVal, oldVal){// 變量名對應(yīng)值改變這里自動觸發(fā)},變量名: {handler(newVal, oldVal){},deep: true, // 深度偵聽(對象里面層的值改變)immediate: true // 立即偵聽(網(wǎng)頁打開handler執(zhí)行一次)}}*/watch: {user: {handler(newVal, oldVal){// user里的對象console.log(newVal, oldVal);},deep: true,immediate: true}} } </script><style></style>總結(jié): immediate立即偵聽, deep深度偵聽, handler固定方法觸發(fā)
4.2_案例-品牌管理(數(shù)據(jù)緩存)
目標(biāo): 偵聽list變化, 同步到瀏覽器本地
- 需求: 把品牌管理的數(shù)據(jù)實(shí)時同步到本地緩存
分析:
? ① 在watch偵聽list變化的時候, 把最新的數(shù)組list轉(zhuǎn)成JSON字符串存入到localStorage本地
? ② data里默認(rèn)把list變量從本地取值, 如果取不到給個默認(rèn)的空數(shù)組
效果:
? 新增/刪除 – 刷新頁面 – 數(shù)據(jù)還在
在之前的案例代碼基礎(chǔ)上接著寫
正確代碼,不可復(fù)制
<script> import moment from "moment"; export default {data() {return {name: "", // 名稱price: 0, // 價格// 3. 本地取出緩存listlist: JSON.parse(localStorage.getItem('pList')) || [],};},// ...其他代碼省略watch: {list: {handler(){// 2. 存入本地localStorage.setItem('pList', JSON.stringify(this.list))},deep: true}} }; </script>今日總結(jié)
- v-for能監(jiān)測到哪些數(shù)組方法變化, 更新頁面
- key的作用是什么
- 虛擬dom好處, diff算法效果
- 動態(tài)設(shè)置class或style
- vue過濾器作用和分類
- vue計(jì)算屬性作用
- vue偵聽器的作用
面試題
1. Vue 中怎么自定義過濾器
? Vue.js允許自定義過濾器,可被用于一些常見的文本格式化。過濾器可以用在兩個地方:雙花括號插值和v-bind表達(dá)式
? 全局的用Vue.filter()
? 局部的用filters屬性
2. Vue中:key作用, 為什么不能用索引
? :key是給v-for循環(huán)生成標(biāo)簽頒發(fā)唯一標(biāo)識的, 用于性能的優(yōu)化
? 因?yàn)関-for數(shù)據(jù)項(xiàng)的順序改變,Vue 也不會移動 DOM 元素來匹配數(shù)據(jù)項(xiàng)的順序,而是就地更新每個元素
? :key如果是索引, 因?yàn)樗饕沁B續(xù)的, 如果刪除其中某一個, 會導(dǎo)致最后一個被刪除
? 當(dāng)我們再刪除的時候, :key再根據(jù)數(shù)據(jù)來把新舊的dom對比時, 刪除:key不存在的對應(yīng)的標(biāo)簽(添加也是一樣的插入到指定位置, 別的都不會動)
3. 數(shù)組更新有的時候v-for不渲染
? 因?yàn)関ue內(nèi)部只能監(jiān)測到數(shù)組順序/位置的改變/數(shù)量的改變, 但是值被重新賦予監(jiān)測不到變更, 可以用 Vue.set() / vm.$set()
寫在最后
?原創(chuàng)不易,還希望各位大佬支持一下\textcolor{blue}{原創(chuàng)不易,還希望各位大佬支持一下}原創(chuàng)不易,還希望各位大佬支持一下
👍 點(diǎn)贊,你的認(rèn)可是我創(chuàng)作的動力!\textcolor{green}{點(diǎn)贊,你的認(rèn)可是我創(chuàng)作的動力!}點(diǎn)贊,你的認(rèn)可是我創(chuàng)作的動力!
?? 收藏,你的青睞是我努力的方向!\textcolor{green}{收藏,你的青睞是我努力的方向!}收藏,你的青睞是我努力的方向!
?? 評論,你的意見是我進(jìn)步的財(cái)富!\textcolor{green}{評論,你的意見是我進(jìn)步的財(cái)富!}評論,你的意見是我進(jìn)步的財(cái)富!
總結(jié)
以上是生活随笔為你收集整理的Vue 过滤器、计算属性、侦听器 图解版 一目了然的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: IT培训机构如何选择?选择IT培训机构3
- 下一篇: 7大原因告诉你,为什么IT行业发展前景好