1、将list的数据存放在public/list.json中
2、store中依赖axios
store简介:基于promise的http库,可以用在浏览器和node.js
store优势:从浏览器创建XMLHttpRequest \ 从node.js创建http请求 \ 拦截请求和相应 \转换请求数据和响应数据 ...
3、store的actions创建接口方法,mutations中为state赋值,state存储数据
actions: {
getList(context) {
axios.get('/list.json').then(({ data }) => {
console.log(data)
context.commit('initList', data)
})
}
},
4、一般在created函数中获取数据,调用actions的方法:this.$store.dispatch('getList')
一般在computed:{}获取state数据
import { mapState} from 'vuex'
//计算属性
computed: {
...mapState(['list']),
}
//使用
<a-list bordered :dataSource="list" class="dt_list">
结构图: