亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

vue入坑筆記（持續(xù)更新）

tanglijun / 3402人閱讀

摘要：如果我們能把不同路由對(duì)應(yīng)的組件分割成不同的代碼塊，只在路由被訪問(wèn)的時(shí)候才加載對(duì)應(yīng)的組件，這樣就更加高效了。這樣會(huì)大大提高首屏顯示的速度，但是可能其他的頁(yè)面的速度就會(huì)降下來(lái)。

一、 代碼分割,讓頁(yè)面按需加載，加快首屏速率

vue.js構(gòu)建單頁(yè)應(yīng)用雖然能通過(guò)路由來(lái)實(shí)現(xiàn)多頁(yè)面效果，但是實(shí)際上打包后所有的代碼都只有一個(gè)入口文件app.bundle.js,當(dāng)項(xiàng)目變得十分龐大的時(shí)候，app.bundle.js文件就會(huì)非常大，而且用戶沒(méi)有訪問(wèn)到的頁(yè)面代碼也包含在其中，使得首頁(yè)加載時(shí)間延長(zhǎng)，非常影響性能和用戶體驗(yàn)。
如果我們能把不同路由對(duì)應(yīng)的組件分割成不同的代碼塊，只在路由被訪問(wèn)的時(shí)候才加載對(duì)應(yīng)的組件，這樣就更加高效了。這樣會(huì)大大提高首屏顯示的速度，但是可能其他的頁(yè)面的速度就會(huì)降下來(lái)。結(jié)合Vue的異步組件和webpackde code splitting feature,我們就輕松實(shí)現(xiàn)路由組件的懶加載。

方法很簡(jiǎn)單，只需要在路由配置中改變模塊的引入方式，比如未修改的index模塊引入是這樣的：

import Indexfrom "components/index/index"

修改后(其他路由引入類(lèi)似)：

const Index = (resolve) => {
  import("components/index/index").then(module => {
    resolve(module)
  })
}
二、將vue項(xiàng)目部署到nginx,刷新頁(yè)面跳轉(zhuǎn)到404錯(cuò)誤頁(yè)面的問(wèn)題 

location / {
    alias D:dist;
    try_files $uri $uri/ /index.html;
}
多個(gè)vue項(xiàng)目共享一個(gè)域名的方法

index.html文件添加

config/index.js文件

3.src/router/index.js文件

Nginx配置修改

將編譯好的dist文件夾放在磁盤(pán)任意位置，比如D盤(pán)

三、axios.js post application/x-www-form-urlencoded參數(shù)問(wèn)題

自己遇到過(guò)的坑，引用別人寫(xiě)的
請(qǐng)求的方法：

self.axios.post(url, {a: 1, b:2}, {
  headers: {
    "Content-Type": "application/x-www-form-urlencoded",
  },
}).then(response => response.data)
  .then(data => {
    console.log(data);
  });

這個(gè)Form Data后臺(tái)取不到數(shù)據(jù)，正常的Form Data數(shù)據(jù)不是應(yīng)該是健值對(duì)的么，像下面這樣：

解決辦法：發(fā)送數(shù)據(jù)前對(duì)data進(jìn)行qs.stringify(data)處理：

var qs = require("qs");
axios.post("/foo", qs.stringify({ "bar": 123 });

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/90504.html

相關(guān)文章

  • Vue入坑筆記

    摘要：近段時(shí)間常使用開(kāi)發(fā)，寫(xiě)點(diǎn)記錄，避免時(shí)間久之忘了。安裝教程查看是否已安裝，在中輸入若已安裝則輸出版本號(hào)。繼承報(bào)錯(cuò)可能是文件路徑問(wèn)題。當(dāng)和繼承的不同時(shí)在文件夾內(nèi)外的話，會(huì)出現(xiàn)該錯(cuò)誤。 近段時(shí)間常使用vue-cli開(kāi)發(fā)，寫(xiě)點(diǎn)記錄，避免時(shí)間久之忘了。 環(huán)境 1. nodejs　　vue-cli開(kāi)發(fā)基于nodejs環(huán)境，確保開(kāi)發(fā)的環(huán)境中已安裝了nodejs。　　安裝教程 https://www....

    superw 評(píng)論0 收藏0

  • 一個(gè)JAVA WEB偽全棧的VUE入坑隨筆，從零點(diǎn)零五學(xué)起

    摘要：開(kāi)始時(shí)間日接觸，先在官網(wǎng)十目一行學(xué)完了基本特性，作為一個(gè)的偽全棧，用感受了一把雙向綁定，感覺(jué)比的要強(qiáng)悍不少，但這開(kāi)發(fā)環(huán)境吧，不能寫(xiě)個(gè)，就總覺(jué)得自己不能零距離接觸。 開(kāi)始時(shí)間：3.26日接觸Vue，先在官網(wǎng)十目一行學(xué)完了基本特性：http://cn.vuejs.org/v2/guide/，作為一個(gè)JAVA WEB的偽全棧，用Myclipse感受了一把雙向綁定，感覺(jué)比JQUERY的JSRE...

    HmyBmny 評(píng)論0 收藏0

  • 前端入坑指南

    摘要：作為自學(xué)兩年的初級(jí)前端，希望對(duì)那些想入門(mén)前端開(kāi)發(fā)的人分享一些觀點(diǎn)。尤其是這幾年前端領(lǐng)域飛速的發(fā)展，新東西層出不窮?；蛘哧P(guān)注下我的微信公眾號(hào)前端獲取每天分享前端入門(mén)知識(shí)。為什么選擇前端 做一件事之前最好問(wèn)問(wèn)自己為什么要做，然后再去思考該怎么做。如果只是看到別人做了，并且有很不錯(cuò)的收入，然后自己就決定做了，很可能中途放棄浪費(fèi)掉很多時(shí)間。起碼問(wèn)自己一個(gè)問(wèn)題：我是否真的熱愛(ài)這個(gè)領(lǐng)域，并且很樂(lè)意在這個(gè)...

    junnplus 評(píng)論0 收藏0

  • Vuex 升級(jí)入坑小記

    摘要：升級(jí)入坑小記場(chǎng)景描述引入的版本為，開(kāi)啟調(diào)試工具默認(rèn)升級(jí)后可以調(diào)試。遂升級(jí)，發(fā)現(xiàn)大量使用失效，報(bào)，的中文文檔，沒(méi)有及時(shí)更新。機(jī)票訂單和用戶信息。 Vuex 升級(jí)入坑小記 場(chǎng)景描述 引入Vuex的版本為0.3，開(kāi)啟調(diào)試工具默認(rèn)升級(jí)后可以調(diào)試Vuex。給作者一個(gè)大大的贊。為提高開(kāi)發(fā)體驗(yàn)也是操碎了心 (??????)?? (8。安利下(Vue Devtools）。 Vue Devtools ...

    ziwenxie 評(píng)論0 收藏0

  • 一個(gè)JAVA WEB偽全棧的VUE入坑隨筆:從登錄開(kāi)始（VUEX）

    摘要：此文章用于記錄本人學(xué)習(xí)歷程，有共同愛(ài)好者可加好友一起分享。從上周天，由于本周有公司籃球比賽，所以耽誤兩天晚上，耗時(shí)三個(gè)晚上勉強(qiáng)做了一個(gè)登錄功能。這里的用戶信息和登錄狀態(tài)都是直接取的中的用戶信息進(jìn)行屬性值初始化。 此文章用于記錄本人VUE學(xué)習(xí)歷程，有共同愛(ài)好者可加好友一起分享。從上周天，由于本周有公司籃球比賽，所以耽誤兩天晚上，耗時(shí)三個(gè)晚上勉強(qiáng)做了一個(gè)登錄功能。中間的曲折只有自己知道，有...

    Zack 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<