在 webstorm 下，vue-cli3.0 創(chuàng)建的項目示绊，其中 eslint 和 webstorm 的格式化代碼沖突問題
// 代碼 App.vue
<script>
export default { // 報錯：Expected indentation of 0 spaces but found 2
name: 'App' // 報錯：Expected indentation of 2 spaces but found 4
} // 報錯：Expected indentation of 0 spaces but found 2
</script>
這種地方锭部，eslint 會要求頂頭寫，但是 webstorm 會加一行縮進耻台，按照網上說去改 webstorm 格式化代碼的設置空免，其實 webstorm 本身設置是沒啥問題的，對著個問題起作用的其實是 eslint 的 plugin
// 安裝 eslint 的 html plugin
npm i eslint-plugin-html -D
// 在 .eslintrc.js 文件中的 plugins 下添加 html
module.exports = {
....
// required to lint *.vue files
plugins: [
'vue', // 原來就有
'html' // 新增的
],
.....
}
vue-router 使用 history 模式下刷新時的404問題（2017-11-8）
由于是單頁面應用盆耽，我們的頁面只有一個index.html蹋砚，在應用內跳轉時路徑都是通過js的API模擬出來的，而刷新時服務器會去按照路徑找文件摄杂，找不到就報了404坝咐，這是個后臺問題，大致思路就是后臺配置 把請求都重定向到index.html頁面的同時不改變 url
參考博客 Apache && nginx
參考博客 Apache && nginx
參考sf回答 tomcat
Vue中的EventBus（2017-10-8）
1.新建bus.js
import Vue from 'vue'
export var bus = new Vue()
2.App.vue里created方法里定義事件
import { bus } from 'bus.js'
// ...
created () {
bus.$on('tip', (text) => {
alert(text)
})
}
3.Test.vue組件內調用
import { bus } from 'bus.js'
// ...
bus.$emit('tip', '123')
Vue官方api
segmentfault——關于vue中$emit事件問題
關于頁面間通訊析恢，回調多次觸發(fā)墨坚，可以參考
vue中eventbus被多次觸發(fā)（vue中使用eventbus踩過的坑）
Axios 發(fā)送 options 請求 403（2017-9-28）
解決方法：
1.服務器端支持 options
2.使用 URLSearchParams 裝 post 用的參數(shù)（兼容性極差）
3.使用 qs 庫來對數(shù)據(jù)進行編碼
// 使用 URLSearchParams 裝 post 用的參數(shù)（兼容性極差）
var params = new URLSearchParams();
params.append('param1', 'value1');
params.append('param2', 'value2');
axios.post('/foo', params);
// 使用 `qs` 庫來對數(shù)據(jù)進行編碼（推薦）
// var qs = require('qs');
import qs from 'qs'
axios.post('/foo', qs.stringify({ 'bar': 123 }));
template 有時會使 element-ui 的 el-form-item 的驗證失效
以下代碼中某一個 el-form-item 會驗證失效
<template v-else>
<el-form-item label="起拍價" prop="gstartingprice">
<el-input v-model.number="goodsForm.gstartingprice" type="number"></el-input>
</el-form-item>
<el-form-item label="拍賣時間" prop="gTimes">
<el-date-picker
v-model="goodsForm.gTimes"
type="datetimerange"
:picker-options="timePickerOptions"
range-separator="至"
start-placeholder="開始日期"
end-placeholder="結束日期"
align="right">
</el-date-picker>
</el-form-item>
<el-form-item label="加價幅度" prop="gaddprice">
<el-input v-model.number="goodsForm.gaddprice" type="number"></el-input>
</el-form-item>
<el-form-item label="拍賣保證金" prop="gcollateral">
<el-input v-model="goodsForm.gcollateral" type="number"></el-input>
</el-form-item>
</template>
