用vuex和axios请求异步数据渲染出问题
来源:22-1 课程总结

沈墨惜
2018-02-28
课我没上完,但是目前遇到个棘手的问题,希望老师看到能帮我解答一下。
我用了vuex和axios做数据请求。下面上代码了
store.js中
const state = { banner: [] } const mutations = { GETBANNER(state, res) { state.banner = res; console.log(res) } } const actions = { getBanner({commit}) { axios.get('/ad/index', { params: { bannerTypeId: 1 } }) .then(function (res) { commit('GETBANNER', res.data.retData.dataList) }) .catch(function (error) { console.log(error); }); } } const getters = { banner: state => state.banner } export default new Vuex.Store({ strict: true, state, getters, mutations, actions })
组件.vue中的JS
export default { name: 'banner', computed: { banner() { return this.$store.getters.banner; } }, mounted() { this.$store.dispatch('getBanner') $('#banner .swiper-slide').height($(window).height()) } }
组件.vue的HTML
<template> <div id="banner"> <!--<div v-for="(item,index) in banner" :key="index">--> <!--<div>{{item}}</div>--> <!--</div>--> </div> </template>
此时在调试工具中
若
<template> <div id="banner"> <div v-for="(item,index) in banner" :key="index"> <div>{{item}}</div> </div> </div> </template>
⌘+S时,仍有数据
刷新页面后,无数据
写回答
1回答
-
ustbhuangyi
2018-02-28
我觉得你应该先根据报错提示解决错误。
052018-03-03
相似问题