vue進(jìn)行圖片的預(yù)加載watch用法實(shí)例講解

watch應(yīng)用場(chǎng)景

創(chuàng)新互聯(lián)建站專業(yè)為企業(yè)提供古浪網(wǎng)站建設(shè)、古浪做網(wǎng)站、古浪網(wǎng)站設(shè)計(jì)、古浪網(wǎng)站制作等企業(yè)網(wǎng)站建設(shè)、網(wǎng)頁設(shè)計(jì)與制作、古浪企業(yè)網(wǎng)站模板建站服務(wù)，10余年古浪做網(wǎng)站經(jīng)驗(yàn)，不只是建網(wǎng)站，更提供有價(jià)值的思路和整體網(wǎng)絡(luò)服務(wù)。

我想信圖片預(yù)加載大家肯定都有接觸過，當(dāng)圖片量大的時(shí)候，為了保證頁面圖片都加載出來的時(shí)候，我們才把主頁面給顯示出來，再進(jìn)行一些ajax請(qǐng)求，或者邏輯操作

那此時(shí)你用computed對(duì)這種監(jiān)聽一個(gè)數(shù)據(jù)然后進(jìn)行一系列邏輯操作和ajax請(qǐng)求，那watch再適合不過了，如果用computed的話那你連實(shí)現(xiàn)都實(shí)現(xiàn)不了，只有用watch監(jiān)聽

我們可以發(fā)現(xiàn)發(fā)四張圖片都加載完畢的時(shí)候頁面才顯示出來

根據(jù)完方有一句話說的很重要的一句

雖然計(jì)算屬性在大多數(shù)情況下更合適，但有時(shí)也需要一個(gè)自定義的 watcher 。這是為什么 Vue 提供一個(gè)更通用的方法通過 watch 選項(xiàng)，來響應(yīng)數(shù)據(jù)的變化。當(dāng)你想要在數(shù)據(jù)變化響應(yīng)時(shí)，執(zhí)行異步操作或開銷較大的操作，這是很有用的。

基于這個(gè)官方的理解再總結(jié)我個(gè)人的整體理解。給出computed和watch的總結(jié)，記住這幾點(diǎn)的總結(jié)，在做項(xiàng)目的時(shí)候想想這些總結(jié)，選擇你的應(yīng)用方法

computed：

監(jiān)聽多個(gè)數(shù)據(jù)或者一個(gè)數(shù)據(jù)來維護(hù)返回一個(gè)狀態(tài)值 ，只要其中一個(gè)或多個(gè)數(shù)據(jù)發(fā)生了變化，則會(huì)從新計(jì)算整個(gè)函數(shù)體，從新返回狀態(tài)值

watch：

只有一個(gè)一個(gè)監(jiān)聽據(jù)，只要這個(gè)數(shù)據(jù)發(fā)生變化，就會(huì)在返回兩個(gè)參數(shù)，第一個(gè)是當(dāng)前的值，第二個(gè)是變化前的值，每當(dāng)變化的時(shí)候，則會(huì)觸發(fā)函數(shù)體的里的邏輯行為，來進(jìn)邏輯后續(xù)操作

以上這篇vue進(jìn)行圖片的預(yù)加載watch用法實(shí)例講解就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持創(chuàng)新互聯(lián)。