首页 > 其他 > 详细

Vuex

时间:2021-05-14 16:19:47      阅读:22      评论:0      收藏:0      [点我收藏+]

基础封装:import Vue from "vue"


import Vuex from ‘vuex‘

Vue.use(Vuex)

export default new Vuex.Store({

state:{}

mutations:{}

actions:{}

getters:{
  getNews(state){
      return state.message.msgData.filter(item => item.status == 0).length // 在页面使用 mapGetters接收
  }
} })

 

 

带module封装

// index文件

import Vue from "vue"

import Vuex from ‘vuex‘

import getters from ‘./getters‘

import "msg" from "@store/modules/message" //
Vue.use(Vuex)

const store = new Vuex.Store({
    msg
})

export default store
//msg.js文件

const state = {msg = []}

const mutations = {....}

const actions = {}

export default {
  namespaced: true,
  state,
  mutations,
  actions
}
//getters  文件

const getters = {
     checkboxData: state => state.customTable.checkboxData,
     msgLength: state => state.message.msgData.filter(item => item.status == 0).length 

}

export default getters

文件划分:

技术分享图片

 

Vuex

原文:https://www.cnblogs.com/0520euv/p/14767130.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!