1.如何封裝一個組件

1.使用Vue.extend()創建一個組件

2.使用Vue.components()方法注冊組件

3.如果子組件需要數據,可以在props中接收定義

4.子組件修改好數據,要把數據傳遞給父組件，可以用emit()方法

原則:

把功能拆開

盡量讓組件原子化,一個組件做一件事情

容器組件管數據,展示組件管視圖

2.封裝一個可復用的組件,需要滿足什么條件？

1.低耦合，組件之間的依賴越小越好

2.最好從父級傳入信息,不要在公共組件中請求數據

3.傳入的數據要進行校驗

4.處理事件的方法寫在父組件中

?

3.vue中如何做強制刷新？

1.localtion.reload()

2.this.$router.go(0)

3.provide和inject

4.vue3和vue2有那些區別？

1.雙向數據綁定的原理不同

2.是否支持碎片

3.API不同

4.定義數據變量方法不同

5.生命的周期不同

6.傳值不同

7.指令和插槽不同

5.vue的性能優化怎么做？

1.編碼優化

不是把所有數據都放在data中

v-for時給每個元素綁定事件用事件代理

keep-alive緩存組件

盡可能拆分組件,提高復用性,維護性

key值要保證唯一

合理使用路由懶加載,異步組件

數據持久化存儲的使用盡量用防抖,節流優化

2.加載優化

按需加載

內容懶加載

圖片懶加載

3.用戶體驗

骨架屏

4.SEO優化

預渲染

服務端渲染

5.打包優化

CDN形式加載第三方模塊

多線程打包

抽離公共文件

6.緩存和壓縮

客戶端緩存,服務端緩存

服務端 Gzip壓縮

6.首屏優化該如何去做？

1.使用路由懶加載

2.非首屏組件使用異步組件

3.首屏不重要的組件延遲加載

4.靜態資源放在CDN上

5.減少首屏上JS，CSS等資源文件的大小

6.使用服務端渲染

7.盡量減少DOM的數量和層級

8.使用精靈圖請求

9.做一些loading

10.開啟Gzip壓縮

11.圖片懶加載

7.vue3的性能為什么比vue2好？

1.diff算法的優化

2.靜態提升

3.事件偵聽緩存

8.vue3為什么使用proxy？

1.proxy可以代理整個對象,defineproperty只代理對象上的某個屬性

2.proxy對代理對象的監聽更加豐富

3.proxy代理對象會生成新的對象,不會修改被代理對象本身

4.proxy不兼容ie瀏覽器

9.說一下你對組件的理解

可以重復使用的vue實例,第一無二的組件名稱

可以抽離單獨的公共模塊

提高代碼的復用率

10.你是如何規劃項目文件的?

public

圖片,index，html，img

src

api

assets

compoents

按分類再次劃分子目錄

plugins

router

static

styles

utils

vies

App.vue

main.js

package.json

vue.config.js

1.SEO如何優化

1.SSR

2.預渲染 prerender-spa-plugin