“ 關注 前端開發社區 ，回復"1"即可加入 前端技術交流群，回復 "2"即可免費領取 500G前端干貨！

16.vue路由傳參數

• 1.使用query方法傳入的參數使用this.$route.query接受
• 2.使用params方式傳入的參數使用this.$route.params接受

17.vuex 是什么？ 有哪幾種屬性？

Vuex 是一個專為 Vue.js 應用程序開發的狀態管理模式。 有 5 種，分別是 state、getter、mutation、action、module

• vuex 的 store 是什么？ vuex 就是一個倉庫，倉庫里放了很多對象。其中 state 就是數據源存放地，對應于一般 vue 對象里面的 datastate 里面存放的數據是響應式的，vue 組件從 store 讀取數據，若是 store 中的數據發生改變，依賴這相數據的組件也會發生更新它通過 mapState 把全局的 state 和 getters 映射到當前組件的 computed 計算屬性
• vuex 的 getter 是什么？ getter 可以對 state 進行計算操作，它就是 store 的計算屬性雖然在組件內也可以做計算屬性，但是 getters 可以在多給件之間復用如果一個狀態只在一個組件內使用，是可以不用 getters
• vuex 的 mutation 是什么？ 更改Vuex的store中的狀態的唯一方法是提交mutation
• vuex 的 action 是什么？ action 類似于 muation, 不同在于：action 提交的是 mutation,而不是直接變更狀態action 可以包含任意異步操作 vue 中 ajax 請求代碼應該寫在組件的 methods 中還是 vuex 的 action 中
• vuex 的 module 是什么？ 面對復雜的應用程序，當管理的狀態比較多時；我們需要將vuex的store對象分割成模塊(modules)。 如果請求來的數據不是要被其他組件公用，僅僅在請求的組件內使用，就不需要放入 vuex 的 state 里如果被其他地方復用，請將請求放入 action 里，方便復用，并包裝成 promise 返回

18.v-show和v-if指令的共同點和不同點？

• v-show指令是通過修改元素的displayCSS屬性讓其顯示或者隱藏
• v-if指令是直接銷毀和重建DOM達到讓元素顯示和隱藏的效果

19.如何讓CSS只在當前組件中起作用？

• 將當前組件的 <style> 修改為 <style scoped>

20.<keep-alive></keep-alive>的作用是什么？

• <keep-alive></keep-alive> 包裹動態組件時，會緩存不活動的組件實例,主要用于保留組件狀態或避免重新渲染。 大白話: 比如有一個列表和一個詳情，那么用戶就會經常執行打開詳情=>返回列表=>打開詳情…這樣的話列表和詳情都是一個頻率很高的頁面，那么就可以對列表組件使用<keep-alive></keep-alive>進行緩存，這樣用戶每次返回列表的時候，都能從緩存中快速渲染，而不是重新渲染

21.delete和Vue.delete刪除數組的區別？

delete只是被刪除的元素變成了 empty/undefined 其他的元素的鍵值還是不變。 Vue.delete直接刪除了數組 改變了數組的鍵值。

var a=[1,2,3,4] var b=[1,2,3,4] delete a[0] console.log(a) //[empty,2,3,4] this.$delete(b,0) console.log(b) //[2,3,4]

22.$nextTick是什么？

vue實現響應式并不是數據發生變化后dom立即變化，而是按照一定的策略來進行dom更新。 nextTick，則可以在回調中獲取更新后的 DOM

23.v-on可以監聽多個方法嗎？

可以。

<input type="text" :value="name" @input="onInput" @focus="onFocus" @blur="onBlur" />

24.v-on 常用修飾符

• .stop 該修飾符將阻止事件向上冒泡。同理于調用 event.stopPropagation() 方法
• .prevent 該修飾符會阻止當前事件的默認行為。同理于調用 event.preventDefault() 方法
• .self 該指令只當事件是從事件綁定的元素本身觸發時才觸發回調
• .once 該修飾符表示綁定的事件只會被觸發一次

25.v-for key的作用。

當Vue用 v-for 正在更新已渲染過的元素列表時，它默認用“就地復用”策略。如果數據項的順序被改變，Vue將不是移動DOM元素來匹配數據項的改變，而是簡單復用此處每個元素，并且確保它在特定索引下顯示已被渲染過的每個元素。 為了給Vue一個提示，以便它能跟蹤每個節點的身份，從而重用和重新排序現有元素，你需要為每項提供一個唯一 key 屬性。key屬性的類型只能為 string或者number類型。 key 的特殊屬性主要用在 Vue 的虛擬 DOM 算法，在新舊 nodes 對比時辨識 VNodes。如果不使用 key，Vue 會使用一種最大限度減少動態元素并且盡可能的嘗試修復/再利用相同類型元素的算法。使用 key，它會基于 key 的變化重新排列元素順序，并且會移除 key 不存在的元素。

26.v-for 與 v-if 的優先級

v-for比v-if優先，如果每一次都需要遍歷整個數組，將會影響速度，尤其是當之需要渲染很小一部分的時候。

27.Vue子組件調用父組件的方法

• 第一種方法是直接在子組件中通過this.$parent.event來調用父組件的方法
• 第二種方法是在子組件里用$emit向父組件觸發一個事件，父組件監聽這個事件就行了。

28.Promise對象是什么？

• 1.Promise是異步編程的一種解決方案，它是一個容器，里面保存著某個未來才會結束的事件（通常是一個異步操作）的結果。從語法上說，Promise 是一個對象，從它可以獲取異步操作的消息。Promise 提供統一的 API，各種異步操作都可以用同樣的方法進行處理。promise對象是一個構造函數，用來生成Promise實例；
• 2.promise的兩個特點 對象狀態不受外界影響 && 一旦狀態改變，就不會再變，任何時候都可以得到結果（pending狀態–>fulfilled || pending–>rejected）

29.axios的特點有哪些？

• 1、axios是一個基于promise的HTTP庫，支持promise的所有API；
• 2、它可以攔截請求和響應；
• 3、它可以轉換請求數據和響應數據，并對響應回來的內容自動轉換為json類型的數據；
• 4、它安全性更高，客戶端支持防御XSRF；

30.vue中的 ref 是什么？

ref 被用來給元素或子組件注冊引用信息。引用信息將會注冊在父組件的 $refs 對象上。如果在普通的 DOM 元素上使用，引用指向的就是 DOM 元素；如果用在子組件上，引用就指向組件實例。

31.Vue的路由模式,實現方式？

hash模式 和 history模式

• hash模式：在瀏覽器中符號“#”，#以及#后面的字符稱之為hash，用window.location.hash讀取； 特點：hash雖然在URL中，但不被包括在HTTP請求中；用來指導瀏覽器動作，對服務端安全無用，hash不會重加載頁面。 hash 模式下:僅 hash 符號之前的內容會被包含在請求中，如 http://www.xxx.com，因此對于后端來說，即使沒有做到對路由的全覆蓋，也不會返回 404 錯誤 。
• history模式：history采用HTML5的新特性；且提供了兩個新方法：pushState（），replaceState（）可以對瀏覽器歷史記錄棧進行修改，以及popState事件的監聽到狀態變更。
• history 模式:前端的 URL 必須和實際向后端發起請求的 URL 一致，如 http://www.xxx.com/items/id。后端如果缺少對 /items/id 的路由處理，將返回 404 錯誤。Vue-Router 官網里如此描述：“不過這種模式要玩好，還需要后臺配置支持……所以呢，你要在服務端增加一個覆蓋所有情況的候選資源：如果 URL 匹配不到任何靜態資源，則應該返回同一個 index.html 頁面，這個頁面就是你 app 依賴的頁面。”

32.

router的區別？

• $route是“路由信息對象”，包括path，params，hash，query，fullPath，matched，name等路由信息參數。
• $router是’路由實例’對象包括了路由的跳轉方法，鉤子函數等。

33.vue.js的兩個核心是什么？

數據驅動、組件系統

34.vue如何兼容ie的問題。

babel-polyfill插件

35.頁面刷新vuex被清空解決辦法？

• 1.localStorage 存儲到本地再回去
• 2.重新獲取接口獲取數據

36.如何優化SPA應用的首屏加載速度慢的問題？

• 1.將公用的JS庫通過script標簽外部引入，減小 app.bundel 的大小，讓瀏覽器并行下載資源文件，提高下載速度；
• 2.在配置 路由時，頁面和組件使用懶加載的方式引入，進一步縮小 app.bundel 的體積，在調用 某個組件時再加載對應的js文件；
• 3.加一個首屏loading圖，提升用戶體驗；

37.Vue 改變數組觸發視圖更新

以下方法調用會改變原始數組：push(), pop(), shift(), unshift(), splice(), sort(), reverse(),Vue.set( target, key, value ) 調用方法：Vue.set( target, key, value ) target：要更改的數據源(可以是對象或者數組) key：要更改的具體數據 value ：重新賦的值

38.DOM 渲染在哪個周期中就已經完成？

mounted

注意 mounted 不會承諾所有的子組件也都一起被掛載。如果你希望等到整個視圖都渲染完畢，可以用 vm.$nextTick 替換掉 mounted

mounted: function () { this.$nextTick(function () { // Code that will run only after the // entire view has been rendered }) }

39.簡述每個周期具體適合哪些場景

• beforecreate : 可以在這加個loading事件，在加載實例時觸發
• created : 初始化完成時的事件寫在這里，如在這結束loading事件，異步請求也適宜在這里調用
• mounted : 掛載元素，獲取到DOM節點 updated : 如果對數據統一處理，在這里寫上相應函數
• beforeDestroy : 可以做一個確認停止事件的確認框

40.第一次加載會觸發哪幾個鉤子？

會觸發beforeCreate , created ,beforeMount ,mounted

41.動態綁定class

active classname， isActive 變量

最近幾天會陸續更新的~~，覺得總結的可以的話，麻煩給小編點一個 在看, 謝謝！

往期：

Vue3 插件開發詳解嘗鮮版

vue面試題總結(一)

移動端 H5 面試（必問）的12個問題及答案

請各位帥哥美女多多支持帥編，回復“1”即可加入前端技術交流群，回復’2‘即可領取 500G 前端干貨

http://weixin.qq.com/r/pDt0bBbEJktZrVIP9262 (二維碼自動識別)

https://weixin.qq.com/g/AQYAANgLdLKQkTu5PYHw7s1OZmCXf4tePumcVQ53vJvfdfK-jL3_Xu7qsbZX8IVd (二維碼自動識別)

總結

以上是生活随笔為你收集整理的vue delete删除json数组_vue面试题总结(二)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。