在 webstorm 下，vue-cli3.0 创建的项目，其中 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事件问题
关于页面间通讯，回调多次触发，可以参考
vue中eventbus被多次触发（vue中使用eventbus踩过的坑）
Axios 发送 options 请求 403（2017-9-28）
解决方法：
1.服务器端支持 options
2.使用 URLSearchParams 装 post 用的参数（兼容性极差）
3.使用 qs 库来对数据进行编码
// 使用 URLSearchParams 装 post 用的参数（兼容性极差）
var params = new URLSearchParams();
params.append('param1', 'value1');
params.append('param2', 'value2');
axios.post('/foo', params);
// 使用 `qs` 库来对数据进行编码（推荐）
// 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>
