[TOC]
### **1. 使用vant 移動ui框架**
網上有教程,需要注意的是使用babel-plugin-import的時候:

在配置babelrc 時,有兩個plugins,而我們需要把vant 配置在第一個上;
***
### 2. **如何使用px 并且自適應**
1.
~~~
npm i lib-flexible --save
~~~
2. 在項目入口文件 main.js 里 引入 lib-flexible
~~~
// main.js
import 'lib-flexible'
~~~
3. px 轉rem
~~~
npm i px2rem-loader --save-dev
~~~
4. 配置css-loader
~~~
// bulid/utils.js
const cssLoader = {
loader: 'css-loader',
options: {
minimize: process.env.NODE_ENV === 'production',
sourceMap: options.sourceMap
}
}
var px2remLoader = {
loader: 'px2rem-loader',
options: {
remUnit: 75
}
}
// 并加入數組中
function generateLoaders(loader, loaderOptions) {
const loaders = options.usePostCSS ? [cssLoader, postcssLoader,px2remLoader] : [cssLoader,px2remLoader]
~~~
***
### 3.使用vue-cli 如何在本地調試接口:
例子:生產環境地址www.baidi.com:8080/aa/bb:
在開發時,proxyTable的配置應該為:
注意:下面的aa不是隨便起的名字,必須為aa:
~~~
// config index.js
proxyTable: {
'/aa': {
target: 'http://www.baidi.com:8080/aa', // 通過本地服務器將你的請求轉發到這個地址
changeOrigin: true, // 設置這個參數可以避免跨域
pathRewrite: {
'^/aa': ''
}
}
},
~~~
項目中請求的地址應該為 axios.get('/aa/bb'),代理解析時會在aa前面加上"www.baidi.com:8080/aa"變成了"www.baidi.com:8080/aa/aa/bb",
但是由于配置中的pathRewrite把aa(第二個aa)改為空字符串,所以請求地址變為"www.baidi.com:8080/aa/bb",
在項目打包上線時,代碼里的請求地址不需要改動,下面我來說為什么,
線上代碼運行時,碰到axios.get('/aa/bb')請求,因為在aa的前面有個"/",表示根目錄的意思,
所以"/aa/bb"會被解析為hostname+port+"aa/bb",所以請求地址就為"www.baidi.com:8080/aa/bb",
***
### vue-jsonp
使用vue-jsonp 來跨域時需要注意的是,請求接口返回的數據直接是json對象是會報錯的:

jsonp需要返回的是一個js腳本。所以使用jsonp 來跨域請求一個json對象是需要后端配合的。
### keep-alive
keep-alive用戶組件緩存,在vue-2.1之后可以使用include和exclude來緩存某個特定的組件,結合vue-router 可以這么使用
~~~
// App.vue
<keep-alive include="home">
<router-view />
</keep-alive>
~~~
**注意:** 這里include的name 并不是router里面的name 而是組件的name 如:
~~~
// home.vue
export default {
name: 'home'
}
~~~
- 空白目錄
- Javascript
- angularjs
- 自定義指令
- scope
- 自定義指令的封裝
- 自定義指令限制只能輸入數字
- 輪播圖
- 寫angular的順序
- $state
- video
- Es6
- Let
- 箭頭函數
- export
- promise
- 函數
- vue
- vue安裝,以及項目結構
- vue的使用
- easy-vue
- vue起步
- vue基礎
- vue-router
- vue-各文件的依賴關系
- vuex
- vue使用sass語法
- mpvue使用wx.parse
- vue-cli 構建vue項目
- vant的使用
- vue使用插件及常見問題
- 原生Js
- 數組
- ajax
- 執行上下文
- 正則表達式
- jqurey
- jqurey-mobile
- html5
- 工具
- svn使用總結
- webpack
- webpack的構建
- WebStorm
- 切圖相關
- 蘋果手機注意事項
- other
- 前端的價值
- 面試相關
- css
- 小程序如何引用外部字體
- 流的理解
- 替換元素
- content和偽元素
- padding和background 繪制圖形
- css圓角,陰影,漸變
- line-height verticle-align
- 使用background繪制4個直角
- android的字體偏上的問題
- 小程序
- 小程序常見問題
- 小程序常用效果
- mpvue
- nodejs
- 前端工程化學習筆記
- mork.js學習