一、狀態共享
使用Vue進行開發時，隨著項目的複雜化，組件個數也逐漸增加，此時我們就面臨著一個問題——多組件狀態共享。也許有人說這不是啥問題，Vuex就可以解決啊。是的，Vuex可以解決多組件狀態共享的問題，但是如果此時我們的項目沒有那麼大那麼複雜，還要使用Vuex來解決這個問題嗎？答案是否定的，因為這會導致代碼繁瑣冗餘。那該怎麼辦？其實我們還可以通過vue.js2.6版本新增的Observable API來解決這個問題。
示例1：Observable實現多組件狀態共享
a) 創建一個 store.js，包含一個store和一個mutations，分別用來指向數據和處理方法。
Vue開發小技巧
b) 在 App.vue裡面引入這個 store.js，使用引入的數據和方法。
Vue開發小技巧
二、長列表性能優化
Vue會通過劫持我們的數據，進而實現視圖響應數據的變化。但有時候我們的數據不需要發生變化，只是純粹的數據展示，此時Vue再進行數據劫持會大大增加組件初始化時間。此時我們可以使用object.freeze方法來阻止vue劫持數據，進而減少組件初始化時間。
示例2：object.freeze方法凍結users值
Vue開發小技巧
注意：object.freeze方法凍結的只是users的值，其引用並未被凍結。
Vue開發小技巧
三、作用域插槽
所謂的作用域插槽，就是父組件在調用子組件時給子組件傳輸一個插槽，且該插槽必須放在template標籤裡邊，同時聲明從子組件接收的數據放在一個自定義屬性內，並定義該數據的渲染方式。
那作用域插槽有什麼用處呢？
比如項目中有一個A組件只負責佈局不管數據邏輯，另一個B組件負責數據處理，A組件需要數據的時候就去B組件中取。那當開發過程中我們的佈局發生變化時，我們只需要修改A組件即可，而不需要修改B組件，這樣就能充分複用B組件的數據邏輯處理。
那瞭解了作用域插槽的用處，接下來我們通過一個簡單的小例子給大家講解作用域插槽的使用方式。
示例3：使用slot、slot-scope實現作用域插槽
a) 創建一個user.vue組件，將user數據綁定在<slot>元素上/<slot>
Vue開發小技巧
b) 在父組件中引用 user組件，展示user數據的firstName數據，此時給 v-slot帶一個值來定義我們提供的插槽 prop 的名字：
Vue開發小技巧
四、屬性事件傳遞
學過react的同學應該都知道react中的{…this.props}可以一次性傳遞屬性。那在vue中有沒有這個功能呢？當屬性較多時，不需要我們一個個去傳遞？答案就是vue中的v-bind和v-on。
示例4：v-bind&v-on實現屬性事件傳遞
BaseList組件只有基礎的列表展示功能，此時需要為其增加排序功能。
a) 創建一個高階組件SortList
Vue開發小技巧
五、函數式組件
函數式組件是一種stateless和instanceless的組件，它內部沒有生命週期處理方式，因而非常輕量，渲染性極高，當需要創建的組件只需要根據外部數據的變化而變化時，就可以將其創建為函數式組件。
寫法如下：
l 在 template標籤裡面標明 functional
l 只接受 props值
l 不需要>
示例5：創建函數
Vue開發小技巧
Vue開發小技巧
Vue開發小技能，你學會了嗎？
閱讀更多 行家網校 的文章
