发表于： 2019-11-11 23:26:00
0 1082
今天完成的事情：最近在照猫画虎的用vuex做模块化开发
vuex:
import axios from 'axios'
// import gradeNav from './gradeNav'
// import home from '../views/home'
const state ={
videoTwo:{
video:[],
ssid:''
}
}
const getters ={
videoTwo_video:state => state.videoTwo.video,
}
const mutations ={
MvideoTwo_video: (state, video) => (
state.videoTwo.video = video,
window.console.log(video)),
}
const actions = {
async AvideoTwo_video({commit}) {
// window.console.log(gradeNav.state.gradeNav.grade)
const response = await axios.get("/a/list/study",{
params:{
type:20
// course:home.state.home._course 等待数据完善开启
// grade:gradeNav.state.gradeNav.grade 等待数据完善开启
}
});
commit('MvideoTwo_video', response.data.data);
},
}
export default {
state,
getters,
mutations,
actions
};
vue
<template>
<div class="video-box">
<div
style="width: 50%;"
@click="videoDetails(lis.id)"
v-for="(lis,i) in videoTwo_video"
:key="i"
>
<div class="video-box-box">
<img :src="lis.cover" width="100%" class="list-img" height="100px" style="display:block" />
<div class="nn"></div>
<div class="pad5">
<h4 class="titlt">《{{lis.title}}》</h4>
<span class="Price maincor">{{lis.price ? lis.price :"免费"}}</span>
<del v-if="lis.discount!=''" class="gray40 text12 mar-l10">{{lis.discount}}</del>
</div>
</div>
</div>
</div>
</template>
<script>
import { mapGetters,mapActions } from "vuex"
export default {
computed: mapGetters(["videoTwo_video"]),
data() {
return {};
},
created() {
this.AvideoTwo_video()
},
methods: {
...mapActions(["AvideoTwo_video"]),
//等详情页写好，改变id和路由跳转
videoDetails(id) {
window.console.log(id);
this.$router.push('/')
}
}
};
</script>
vuex index.js
import Vue from 'vue'
import Vuex from 'vuex'
import treeHole from './views/treeHole'
import home from './views/home'
import myinfo from './views/myinfo'
import singin from './views/singin'
import AccountsSafety from './views/AccountsSafety'
// 模块
import gradeNav from './modules/gradeNav'//顶部导航
import videoTwo from './modules/videoTwo'
Vue.use(Vuex)
export default new Vuex.Store({
state: {
page:1,
learn_type:20
},
getters:{
learn_type:state => state.learn_type
},
mutations: {
},
actions: {
},
modules: {
treeHole,
home,
myinfo,
gradeNav,
videoTwo,
singin,
AccountsSafety
}
})
明天计划的事情：写微信静默登录
遇到的问题：还有有点模糊，实践中寻找答案吧
收获：学习中成长
返回列表
评论