1. 调取后端接口的方法，一定要写在api/xxx.js里面
调取后端接口的方法，一定要写在 api/xxx.js 里面。
然后，在 actions 中，使用 api/xxx.js 中的方法。
然后，在 actions 中，去 commit ，提交到 mutations 中的方法，去更改公共状态。
然后，在组件中，使用 mapActions ，去调用 actions 中的方法。
然后，就可以，在组件中，使用 mapState ，去拿到 Vuex 中的公共状态了。
2. 在 actions 中，请求后端返回的数据一定要存到 公共状态 里面。
通过，在 mutations 中，去更改公共状态。
3.
// 页面打开 // 进行初始化 订单详情接口，网银支付的银行接口
4.
Vue CLI 3 中 关于 vue.config.js
5.
在actions中，请求接口，得到的数据，一般存在公共状态里。
然后，在组件中，使用 mapState() 去调取 Vuex 里的公共状态。
6.
普通的ul li 选中的效果
Vue 中 li 的点击选择，以及默认选中效果。
7.
在点击事件中， 同时传入e事件对象和 index， 可以传3个参数
@click = "chooseBank($event, index)"
或者
@click = "chooseBank($event, index, item.name)"
//选择银行
chooseBank(e, index) {
console.log(index)
this.chooseBankFlag = index
console.log(e)
// console.log(e.target)
let data = ''
if (e.target.nodeName == "SPAN") { //点击的是span
data = e.target.innerHTML
} else if (e.target.nodeName == "IMG") { //点击的是图片
data = e.target.nextElementSibling.innerHTML //取的是下一个元素的innerHTML
} else if (e.target.nodeName === "LI") { //点击的是 li
data = e.target.children[1].innerHTML
}
console.log(data)
}
8.
li 默认选中
本来 chooseBankFlag:-1，就代表页面加载完后，一个都不选中。
改成 chooseBankFlag: 0,
然后 :class="{ 'choose-bank-selected': chooseBankFlag == index}"
页面一打开，就默认选中第一个了。
9.
在点击事件中，同时传入3个参数，可以传入item.name，就不用通过e事件对象，来获取点击的是哪个值了。
@click = "chooseBank($event, index, item.name)"
// 选择银行
chooseBank (e,index, name) {
//console.log(index)
this.chooseBankFlag = index
console.log(name);
}
9.
Vue 的公共拦截， 公共判断
####10. 关于 body-parser / express
11.
1.在 axios 的拦截器中配置全局 loading
2.在 axios 中加入JWT Token
3.li 的点击选择 和 默认选中
4.公共的Vuex属性，需要写在 store/index.js 里面。
因为在 ajaxRequest.js 中引入的是 import store from '../store'
5.使用Axios拦截器(对响应结果进行拦截，在请求头里加入JWT Token, 配置loading)
5.1 首先模拟后端接口
server/server.js
5.2 在 api 中编写请求接口的方法。
12.
=> 全部改用 ajaxRequest.js
因为 增加了loading，请求头里面，也加上了 JWT Token
=> 只能使用 ajaxRequest.js 了
开发注意点：
1.token一定要放在Axios的拦截器里面，才能保证每次请求，都会在请求头里加上token。
2.一定要使用 ajaxRequest.js,因为：
(1) 配置了全局loading，每次请求前，都会显示loading。
(2) 在请求头里面，加上了 token。
13. vue img src的绑定问题
vue img src的绑定问题
<li v-for="(item, index) in tradesBanksObj"
@click="chooseBank($event, index, item)"
:key="index"
:class="{ 'choose-bank-selected' : chooseBankFlag == index}">
<img :src="('/images/bank-logo-map/' + item + '.png')" />
<span>{{item.name}}</span>
<i></i>
</li>
14.
监听 Token 过期
就是请求接口报错了，就立马，跳转，或者提示
15.
获取 RadioGroup 选中的值
不能加 v-model， 是用来设置值的，不是用来取值的。
16.
将弹窗封装为全局插件
17.
vue ant design 上拉菜单
