本篇文章給大家分享的是有關(guān)使用Vue.js場(chǎng)遇到的問題有哪些，小編覺得挺實(shí)用的，因此分享給大家學(xué)習(xí)，希望大家閱讀完這篇文章后可以有所收獲，話不多說，跟著小編一起來看看吧。

創(chuàng)新互聯(lián)是少有的網(wǎng)站設(shè)計(jì)、成都網(wǎng)站制作、營(yíng)銷型企業(yè)網(wǎng)站、微信小程序開發(fā)、手機(jī)APP,開發(fā)、制作、設(shè)計(jì)、賣鏈接、推廣優(yōu)化一站式服務(wù)網(wǎng)絡(luò)公司,2013年開創(chuàng)至今,堅(jiān)持透明化,價(jià)格低,無套路經(jīng)營(yíng)理念。讓網(wǎng)頁驚喜每一位訪客多年來深受用戶好評(píng)

類空指向

就是類似于空指針的一種錯(cuò)誤方式 不會(huì)在 console 上報(bào)錯(cuò) 非常難找的問題

resp.data.user.avatar

//如果這個(gè)user是null的話 這么調(diào)用不會(huì)報(bào)錯(cuò) 也不會(huì)向下執(zhí)行 非常坑

//如果你想判斷這個(gè)avatar的話 要這么做

if(resp.data.user && resp.data.user.avatar){
 //do...
}

ES6 箭頭函數(shù)

箭頭函數(shù)和非箭頭函數(shù)也是有很大區(qū)別的

//普通匿名函數(shù)寫法
api()
.then(function(resp){
 this.count()
 //注意這個(gè)this 不是能正常使用的 count會(huì)是個(gè)undefined
})


//ES6 箭頭函數(shù)
api()
.then(resp => {
 this.count()
 //這里沒毛病
})

vuetify

這是一個(gè)基于 Google Material 設(shè)計(jì)語言的 UI 框架，可以在 Vue.js 運(yùn)行。

只是安裝方式有點(diǎn)特殊，并且它的插件安裝方式也很特殊。

例如 vuetify 的 dialog

import VuetifyDialog from 'vuetify-dialog'
import vuetify from './plugins/vuetify';

Vue.use(VuetifyDialog, {
 context: {
 vuetify
 }
})

這就導(dǎo)致你寫 UI 的時(shí)候 要面向 Google 編程。（雖說其他后端語言也差不多 笑）

vue-cli

如果你是要新創(chuàng)建一個(gè)項(xiàng)目，并且這個(gè)項(xiàng)目規(guī)模不是特別大。

我非常推薦你使用 vue-cli 創(chuàng)建，說簡(jiǎn)單點(diǎn)兒 這會(huì)提升 b 格。

廢話少說 上圖

vue create your_project_name

vue ui

vue ui 會(huì)打開一個(gè)可視化頁面 像是上圖那樣。

然后在里面導(dǎo)入由 vue-cli 創(chuàng)建的項(xiàng)目就可以和上圖一樣了 :)

異步和同步

其實(shí)之前有個(gè)非常蠢的想法。

就是在用戶輸完表單之后，立即和服務(wù)器進(jìn)行驗(yàn)證，然后將結(jié)果刷新到 UI 上。

但是這個(gè)刷新 UI 需要一個(gè)同步操作。

我就一個(gè)勁的折騰怎么去搞定將 axios 的異步操作變成同步。

如果是之前的 jQuery 就非常簡(jiǎn)單么 只需要將里面的 aysnc 屬性改掉就可以了。

但是你每次發(fā)請(qǐng)求 瀏覽器都會(huì)在 console 上提示 不推薦 XHR 同步請(qǐng)求。

為啥呢，因?yàn)闉g覽器里面頁面是單線程的，如果你的請(qǐng)求是同步的，那么就會(huì)導(dǎo)致每個(gè)請(qǐng)求都會(huì)讓頁面卡住一定的時(shí)間。

所以我最后還是改成了逐步驗(yàn)證的方式 讓所有的請(qǐng)求都是異步操作的。

運(yùn)行和部署

如果你本地開發(fā)

運(yùn)行 serve(有些項(xiàng)目是 dev) 會(huì)開放一個(gè)端口號(hào) 讓你訪問用戶界面，并進(jìn)行接近實(shí)時(shí)的 UI 調(diào)整。

如果你是要部署到線上 需要先執(zhí)行 build 會(huì)在輸出目錄里面生成靜態(tài)文件。

再把這些文件部署到服務(wù)器上 像是：

• nginx

• caddy

這里我非常推薦 caddy，它是一個(gè)基于 golang 開發(fā)的服務(wù)器，部署輕量化，并且?guī)в泄芾?api，非常良好的支持 Http2，并且 支持 http3。

以上就是使用Vue.js場(chǎng)遇到的問題有哪些，小編相信有部分知識(shí)點(diǎn)可能是我們?nèi)粘９ぷ鲿?huì)見到或用到的。希望你能通過這篇文章學(xué)到更多知識(shí)。更多詳情敬請(qǐng)關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

標(biāo)題名稱：使用Vue.js場(chǎng)遇到的問題有哪些-創(chuàng)新互聯(lián)
網(wǎng)站地址：http://www.chinadenli.net/article42/djdghc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供商城網(wǎng)站、網(wǎng)站維護(hù)、服務(wù)器托管、微信公眾號(hào)、網(wǎng)站排名、網(wǎng)站改版

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)