這15道Vue常見面試題,你會幾道??

来源:https://www.cnblogs.com/chengxuyuanaa/archive/2020/06/15/13137821.html
-Advertisement-
Play Games

1.vue優點? 答: 輕量級框架:只關註視圖層,是一個構建數據的視圖集合,大小隻有幾十 kb ; 簡單易學:國人開發,中文文檔,不存在語言障礙 ,易於理解和學習; 雙向數據綁定:保留了 angular 的特點,在數據操作方面更為簡單; 組件化:保留了 react 的優點,實現了 html 的封裝和 ...


1.vue優點?

答:

  • 輕量級框架:只關註視圖層,是一個構建數據的視圖集合,大小隻有幾十 kb ;

  • 簡單易學:國人開發,中文文檔,不存在語言障礙 ,易於理解和學習;

  • 雙向數據綁定:保留了 angular 的特點,在數據操作方面更為簡單;

  • 組件化:保留了 react 的優點,實現了 html 的封裝和重用,在構建單頁面應用方面有著獨特的優勢;

  • 視圖,數據,結構分離:使數據的更改更為簡單,不需要進行邏輯代碼的修改,只需要操作數據就能完成相關操作;

  • 虛擬DOM:dom 操作是非常耗費性能的, 不再使用原生的 dom 操作節點,極大解放 dom 操作,但具體操作的還是 dom 不過是換了另一種方式;

  • 運行速度更快:相比較於 react 而言,同樣是操作虛擬 dom ,就性能而言, vue 存在很大的優勢。

2.vue父組件向子組件傳遞數據?

答:通過 props

3.子組件像父組件傳遞事件?

答:$emit 方法

4.v-show 和 v-if指令的共同點和不同點?

答:

共同點: 都能控制元素的顯示和隱藏;

不同點: 實現本質方法不同,v-show 本質就是通過控制 css 中的 display 設置為 none,控制隱藏,只會編譯一次;v-if 是動態的向 DOM 樹內添加或者刪除 DOM 元素,若初始值為 false ,就不會編譯了。而且 v-if 不停的銷毀和創建比較消耗性能。總結:如果要頻繁切換某節點,使用 v-show (切換開銷比較小,初始開銷較大)。如果不需要頻繁切換某節點使用 v-if(初始渲染開銷較小,切換開銷比較大)。

如果你以上的都會了, 說明你 60分及格了,另外現在vue3.0出來了,找工作一般都會問到,如果你還沒學好。可以去小編前端扣扣裙 519293536 交流學習,裡面有很多大佬,還有前端新技術資料分享!

5. 如何讓CSS只在當前組件中起作用?

答:在組件中的 style 前面加上 scoped

6. 的作用是什麼?

答: keep-alive 是 Vue 內置的一個組件,可以使被包含的組件保留狀態,或避免重新渲染。

7.如何獲取dom?

答:ref="domName" 用法:this.$refs.domName

8.說出幾種vue當中的指令和它的用法?

答:v-model 雙向數據綁定;

v-for 迴圈;

v-if v-show 顯示與隱藏;

v-on 事件;v-once : 只綁定一次。

9. vue-loader是什麼?使用它的用途有哪些?

答:vue 文件的一個載入器,將 template/js/style 轉換成 js 模塊。

用途:js 可以寫 es6 、 style樣式可以 scss 或 less 、 template 可以加 jade

10.為什麼使用key?

答:需要使用 key 來給每個節點做一個唯一標識, Diff 演算法就可以正確的識別此節點。作用主要是為了高效的更新虛擬 DOM。

11.axios及安裝?

答:請求後臺資源的模塊。npm install axios —save 裝好, js中使用 import 進來,然後 .get 或 .post 。返回在 .then 函數中如果成功,失敗則是在 .catch 函數中。

12.v-modal的使用

答:v-model 用於表單數據的雙向綁定,其實它就是一個語法糖,這個背後就做了兩個操作:v-bind 綁定一個 value 屬性;v-on 指令給當前元素綁定 input 事件。

13.請說出vue.cli項目中src目錄每個文件夾和文件的用法?

答:assets 文件夾是放靜態資源;components 是放組件;router 是定義路由相關的配置; app.vue 是一個應用主組件;main.js 是入口文件。

14.分別簡述computed和watch的使用場景

答:

  • computed : 當一個屬性受多個屬性影響的時候就需要用到 computed ,最典型的慄子:購物車商品結算的時候

  • watch : 當一條數據影響多條數據的時候就需要用 watch ,慄子:搜索數據

15.v-on可以監聽多個方法嗎?

答:可以,慄子:<input type="text" v-on="{ input:onInput,focus:onFocus,blur:onBlur, }">
最後

總結:如果你以上的都會了, 說明你 60分及格了,另外現在vue3.0出來了,找工作一般都會問到,如果你還沒學好。可以去小編前端扣扣裙 519293536 交流學習,裡面有很多大佬,還有前端新技術資料分享!
本文的文字及圖片來源於網路加上自己的想法,僅供學習、交流使用,不具有任何商業用途,版權歸原作者所有,如有問題請及時聯繫我們以作處理


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 往大數據方向發展需要學哪些技術?網上一搜真是指不勝屈。對於小白來說,實在是一頭霧水,到底哪些是當下流行的?哪些是必須要先學會的?流行?主次搞不清。為瞭解決這些疑惑,羚羊專門花了些時間, 挨個技術去研究對比歸類,大概總結出以下的技術點: 文件存儲: Hadoop HDFS、GFS、KFS、Tachyo ...
  • 1. 前言 Block:帶有自動變數(局部變數)的匿名函數。它是C語言的擴充功能。之所以是拓展,是因為C語言不允許存在這樣匿名函數。 1.1 匿名函數 匿名函數是指不帶函數名稱函數。C語言中,函數是怎樣的呢?類似這樣: int func(int count); 調用的時候: int result = ...
  • UIStackView的子項在做Hide動畫時有概率出現佈局成功,但不能成功隱藏子項。 解決:避免對已經隱藏的子項再次觸發隱藏 if(v.isHidden == NO) { [v setHidden:1]; } ...
  • 在 iOS 13 中 Apple 為 UITableView 和 UICollectionView 引入了 DiffableDataSource,讓開發者可以更簡單高效的實現 UITableView、UICollectionView 的局部數據刷新。新的刷新的方法為 apply,通過使用 apply ...
  • 新聞 Android 11更新媒體存儲API 第三方App也可用上回收站 長視頻錄製不用愁:Android 11已取消過時的4GB文件容量上限 Android 11 首個測試版來了 這五大重點更新值得你關註 谷歌改進應用打包格式 以精簡Android游戲安裝包的尺寸 教程 Android 11 Be ...
  • 一、變數提升練習 1.​變數提升:定義變數的時候,變數的聲明會被提升到作用域的最上面​,變數的賦值不會提升。 var str1 = "練習"; fn1(); function fn1(){ console.log(str1);//undefined var str1 = "練習2"; } conso ...
  • VUE項目性能優化 Vue 代碼層面的優化; Webpack 配置層面的優化; 基礎的Web技術層面的優化; 一、代碼層面的優化 1.1 v-if 和 v-show區分使用場景 v-if是 真正 的條件渲染,因為它會確保在切換過程中條件塊內的事件監聽器和子組件適當地被銷毀和重建;也是惰性的:如果在初 ...
  • 1. 構造compiler 個人覺得 本章 可以大概看看我寫的內容 最有效的方法是查看測試用例 很詳細 覆蓋很全面 這一段比較繞,主要是包裝compile,最終暴露出compile本身以及包裝後的compileToFunctions 1.1 compiler和compileToFunctions的基 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...