AVt天堂网 手机版,亚洲va久久久噜噜噜久久4399,天天综合亚洲色在线精品,亚洲一级Av无码毛片久久精品

當前位置:首頁 > 科技  > 軟件

頻繁切換v-show,不頻繁使用v-if?面試的時候可別再這么說了!

來源: 責編: 時間:2024-04-22 09:15:38 183觀看
導讀Hello,大家好,我是 Sunday。很多同學應該都在面試中遇到過這樣的問題:“v-if 和 v-show 有什么區別?我們應該在什么情況下使用 v-if,什么情況下使用 v-show 呢?”很多同學一聽,這不太簡單了,基礎八股文啊(官網中也有明確的文檔

Hello,大家好,我是 Sunday。kQu28資訊網——每日最新資訊28at.com

很多同學應該都在面試中遇到過這樣的問題:“v-if 和 v-show 有什么區別?我們應該在什么情況下使用 v-if,什么情況下使用 v-show 呢?”kQu28資訊網——每日最新資訊28at.com

很多同學一聽,這不太簡單了,基礎八股文啊(官網中也有明確的文檔說明),瞧不起誰呢?直接來一通標準回答:“v-if 控制 dom 的渲染,v-show 通過 css 控制 dom 的顯示。如果切換頻繁,那么就使用 v-show,否則就使用 v-if”。kQu28資訊網——每日最新資訊28at.com

但是真實情況真的是這樣嗎?面試官接下來的一個問題,可能就會直接讓你無法回答:“那么,什么情況下叫做切換頻繁,什么情況下叫做切換不頻繁呢?”kQu28資訊網——每日最新資訊28at.com

是啊,什么是頻繁,什么是不頻繁呢?kQu28資訊網——每日最新資訊28at.com

我們無法判斷 dom 是否頻繁切換

假如:有一個用戶表單,表單上存在一個“角色”按鈕:kQu28資訊網——每日最新資訊28at.com

圖片圖片kQu28資訊網——每日最新資訊28at.com

點擊角色按鈕,彈出一個 dialog 彈出層:kQu28資訊網——每日最新資訊28at.com

圖片圖片kQu28資訊網——每日最新資訊28at.com

那么此時,角色 dialog 的切換是否頻繁呢? 我相信很多同學都沒有辦法給出一個確切的答案吧。kQu28資訊網——每日最新資訊28at.com

所以說:kQu28資訊網——每日最新資訊28at.com

在實際開發中:開發者是無法判斷 dom 是否頻繁切換的。kQu28資訊網——每日最新資訊28at.com

v-if 和 v-show 的真實使用場景

我們可以回憶下日常工作中的真實場景,決定使用 v-if 和 v-show 的依據是什么呢?kQu28資訊網——每日最新資訊28at.com

其核心應該是:v-if 會導致 組件(dom)的重新渲染,但是 v-show 不會。kQu28資訊網——每日最新資訊28at.com

重新渲染就意味著:整個生命周期會重新執行。 當 v-if 為 false 時,整個組件是不存在的,而變為 true 之后,組件會重新執行所有的生命周期回調。假如我們在 created 這種生命周期鉤子中執行了 接口請求 的方法,這就意味著 此時接口的請求才會觸發 。如果接口觸發會 依賴其他參數(如:props) 那么此時的請求時機會剛剛好。kQu28資訊網——每日最新資訊28at.com

而對于 v-show 而言,整個生命周期只會觸發一次。 當 v-show 為 false 時,組件雖然看不到,但是 已經存在了。這也就意味著,假如我們在 created 這種生命周期鉤子中執行了 接口請求 的方法, 此時接口已經請求了,如果接口請求中涉及到 點擊之后才可以獲取的參數(props),那么此時因為沒有點擊,所以你可能會得到一個錯誤。kQu28資訊網——每日最新資訊28at.com

該問題如何回答

所以,基于以上原因,這個問題大家可以這么說(以下回答僅供參考):kQu28資訊網——每日最新資訊28at.com

Vue 官方中對 v-if 和 v-show 的使用場景區分是:當需要頻繁顯示和隱藏的時候,那么需要使用 v-show 否則需要使用 v-if。kQu28資訊網——每日最新資訊28at.com

但是在實際的開發中我們是 無法分辨一個場景(Dialog)是否是頻繁切換的。kQu28資訊網——每日最新資訊28at.com

所以說,在實際開發中,判斷 v-if 和 v-show 的使用需要根據它們的特性來進行判斷。kQu28資訊網——每日最新資訊28at.com

v-show 不會導致組件被銷毀和渲染,但是 v-if 會導致組件被銷毀和重新渲染。kQu28資訊網——每日最新資訊28at.com

也就是說:當使用 v-show 時,雖然用戶看不到組件,但是當前組件的生命周期都已經執行了。如果在 created 中存在接口的調用,則【接口已經調用完成】。同時,當組件隱藏時,組件并不會銷毀。相反:如果是 v-if 的每次點擊時都會重新渲染組件,重新執行生命周期,隱藏則銷毀組件。kQu28資訊網——每日最新資訊28at.com

所以說,判斷 v-if 和 v-show 的使用條件應該是:當組件需要在指定時機創建,在指定時機銷毀時,需要使用 v-if。而 當組件僅需要創建一次時,則可以使用 v-show。kQu28資訊網——每日最新資訊28at.com

本文鏈接:http://www.tebozhan.com/showinfo-26-84467-0.html頻繁切換v-show,不頻繁使用v-if?面試的時候可別再這么說了!

聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。郵件:2376512515@qq.com

上一篇: 探秘C++虛函數:解密多態的奧秘

下一篇: 在前端中,什么是幽靈依賴?

標簽:
  • 熱門焦點
  • 一加Ace2 Pro真機揭曉 鈦空灰配色質感拉滿

    終于,在經過了幾波預熱之后,一加Ace2 Pro的外觀真機圖在網上出現了。還是博主數碼閑聊站曝光的,這次的外觀設計還是延續了一加11的方案,只是細節上有了調整,例如新加入了鈦空灰
  • K6:面向開發人員的現代負載測試工具

    K6 是一個開源負載測試工具,可以輕松編寫、運行和分析性能測試。它建立在 Go 和 JavaScript 之上,它被設計為功能強大、可擴展且易于使用。k6 可用于測試各種應用程序,包括 Web
  • 一文看懂為蘋果Vision Pro開發應用程序

    譯者 | 布加迪審校 | 重樓蘋果的Vision Pro是一款混合現實(MR)頭戴設備。Vision Pro結合了虛擬現實(VR)和增強現實(AR)的沉浸感。其高分辨率顯示屏、先進的傳感器和強大的處理能力
  • Golang 中的 io 包詳解:組合接口

    io.ReadWriter// ReadWriter is the interface that groups the basic Read and Write methods.type ReadWriter interface { Reader Writer}是對Reader和Writer接口的組合,
  • “又被陳思誠騙了”

    作者|張思齊 出品|眾面(ID:ZhongMian_ZM)如今的國產懸疑電影,成了陳思誠的天下。最近大爆電影《消失的她》票房突破30億斷層奪魁暑期檔,陳思誠再度風頭無兩。你可以說陳思誠的
  • 網紅炒股不為了賺錢,那就是耍流氓!

    來源:首席商業評論6月26日高調宣布入市,網絡名嘴大v胡錫進居然進軍了股市。在一次財經媒體峰會上,幾個財經圈媒體大佬就“胡錫進炒股是否知道認真報道”展開討論。有
  • 超級標準版旗艦!iQOO 11S全球首發iQOO超算獨顯芯片

    上半年已接近尾聲,截至目前各大品牌旗下的頂級旗艦都已悉數亮相,而下半年即將推出的頂級旗艦已經成為了數碼圈爆料的主流,其中就包括全新的iQOO 11S系
  • iQOO Neo8 Pro真機諜照曝光:天璣9200+和V1+旗艦雙芯加持

    去年10月,iQOO推出了iQOO Neo7系列機型,不僅搭載了天璣9000+,而且是同價位唯一一款天璣9000+直屏旗艦,一經上市便受到了用戶的廣泛關注。在時隔半年后,
  • 世界人工智能大會國際日開幕式活動在世博展覽館開啟

    30日上午,世界人工智能大會國際日開幕式活動在世博展覽館開啟,聚集國際城市代表、重量級院士專家、國際創新企業代表,共同打造人工智能交流平臺。上海市副市
Top