vue常用知識總結(jié)

Mvvm模式

MVVM分為model(數(shù)據(jù)模型)、view(視圖)、viewmodel(視圖模型)三者。

Model:指的是js中的數(shù)據(jù),如對象,數(shù)組等等

View:指的是頁面視圖

viewModel:指的是vue實例化對象

viewmodel是view和model的連接器,view和model通過viewmodel來實現(xiàn)數(shù)據(jù)綁定,而viewmodel通過數(shù)據(jù)綁定和dom監(jiān)聽來實現(xiàn)的

vue如何打包上傳至服務(wù)器

修改本地項目文件index.js配置。

壓縮項目文件。

上傳壓縮后的項目到服務(wù)器

解壓項目并開啟777權(quán)限

修改服務(wù)器里的一些配置

重啟apche

vue全家桶

vue-router 路由

vuex 狀態(tài)管理工具

vue-cli 項目構(gòu)建工具

axios http請求工具(vue-resource 是vuejs的一款插件,也是用來請求接口。vue2.0后不再更新,推薦使用axios接口請求工具)

組件庫

傳參

1. vue可以通過標(biāo)簽router-link跳轉(zhuǎn)傳參,通過path+路徑,query+參數(shù)

2. 也可以通過事件里的this.$router.push({})跳轉(zhuǎn)傳參

Vue的優(yōu)缺點(diǎn)

優(yōu)點(diǎn):

1. 輕量級的框架

2. 雙向數(shù)據(jù)綁定

3.組件化

4.漸進(jìn)式

5. MVVM模式

缺點(diǎn):

1. 缺乏高階教程

2.不支持IE8

3. 生態(tài)環(huán)境差

4.社區(qū)不大

5. 報錯不明顯,適合單人開發(fā)或者中小型項目

vuex

Vuex 是一個專為 Vue.js 應(yīng)用程序開發(fā)的狀態(tài)管理模式。它采用集中式存儲管理應(yīng)用的所有組件的狀態(tài),并以相應(yīng)的規(guī)則保證狀態(tài)以一種可預(yù)測的方式發(fā)生變化

Vue的兩個核心

組件化

數(shù)據(jù)綁定

vue中父組件與子組件的傳值

父組件傳給子組件:子組件通過props方法接受數(shù)據(jù);

子組件傳給父組件:$emit方法傳遞參數(shù)

兄弟組件傳值:eventBus方法傳值,項目大的時候建議使用vuex

vue動態(tài)路由

在 router 目錄下的 index.js 文件中,對 path 屬性加上 /:id。使用 router 對象的 params.id,例如:this.$route.params.id

vue的生命周期

beforeCreate 創(chuàng)建前

created 創(chuàng)建后

beforeMount 載入前

mounted 載入后

beforeUpdate 更新前

updated 更新后

beforeDestroy 銷毀前

vue的常用指令

v-if:滿足條件則創(chuàng)建DOM元素,不滿足則刪除DOM元素

v-for:遍歷,基于數(shù)據(jù)源循環(huán)渲染元素或模板塊。

v-show:滿足條件則顯示DOM元素,不滿足則隱藏DOM元素

v-text:渲染文本(統(tǒng)統(tǒng)解析成文本)

v-html:渲染文本(能解析 HTML 標(biāo)簽)

v-on:綁定事件(可以縮寫為@)

v-bind:綁定屬性,單向數(shù)據(jù)綁定。將綁定的屬性作為JavaScript表達(dá)式計算后輸出(可以縮寫為:)

v-model:綁定屬性,雙向數(shù)據(jù)綁定。將綁定的屬性作為JavaScript表達(dá)式計算后輸出

vue的計算屬性

計算屬性是vue實例中的一個配置選項:computed

通常里面都是一個個計算相關(guān)的函數(shù),返回最后計算出來的值。

即我們可以把這些計算的過程寫到一個計算屬性中去,然后讓它動態(tài)的計算

計算屬性一般就是用來通過其他的數(shù)據(jù)算出一個新數(shù)據(jù),而且它有一個好處就是,它把新的數(shù)據(jù)緩存下來了,當(dāng)其他的依賴數(shù)據(jù)沒有發(fā)生改變,它調(diào)用的是緩存的數(shù)據(jù),這就極大的提高了我們程序的性能。而如果寫在methods里,數(shù)據(jù)根本沒有緩存的概念,所以每次都會重新計算。

v-for的key屬性

1.使用v-for時,key屬性是必須的。

2. key屬性用來標(biāo)識當(dāng)前循環(huán)這一項的唯一身份。

3. key屬性的值必須是number或string。

4.必須通過綁定的方式指定key的值。

axios是什么和它的特性

axios 是一個基于 promise 的 HTTP 庫,可以發(fā)送 get,post 請求,正是由于 Vue、React 的出現(xiàn),促使了 axios 輕量級庫的出現(xiàn)

特點(diǎn)

1.可以在瀏覽器中發(fā)送 XMLHttpRequest 請求

2.可以在 node.js 發(fā)送 http 請求

3.支持 Promise API

4.攔截請求和響應(yīng)

5.轉(zhuǎn)換請求和響應(yīng)

6.轉(zhuǎn)換請求數(shù)據(jù)和響應(yīng)數(shù)據(jù)

7.能夠取消請求

8.自動轉(zhuǎn)化 JSON 格式

如何讓CSS只在當(dāng)前組件中起作用

將當(dāng)前組件的<style>修改為<style scoped>

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容