module

文件夹分布

|-- store
      |-- index.js
      |-- cart
            |-- index.js
            |-- mutations.js
            |-- mutation-types.js
            |-- actions.js

...同理

index.js

import Vue from 'vue';
import Vuex from 'vuex';
import vux from './vux';
import main from './main';
import products from './products';
import cart from './cart';

Vue.use(Vuex);

export default new Vuex.Store({
  modules: {
    vux,
    main,
    products,
    cart,
  },
});

cart => index.js

import mutations from './mutations';
import actions from './actions';

const state = {
  cartData: [],
  promotionData: [],
  // 购物车是否有商品
  isHasCart: false,
};

export default {
  state,
  mutations,
  actions,
};

cart => mutations.js

import { GET_CART_DATA,
  GET_PROMOTION_DATA,
  ADD_CART,
  DELETE_CART_PRO } from './mutation-types';

const mutations = {
  // 获取购物车商品
  [GET_CART_DATA](state) {
    if (sessionStorage.getItem('cartData')) {
      state.cartData = JSON.parse(sessionStorage.getItem('cartData'));
      state.isHasCart = true;
    } else {
      state.cartData = [];
      state.isHasCart = false;
    }
  },
  // 获取折扣商品信息
  [GET_PROMOTION_DATA](state) {
    const promotionData = sessionStorage.getItem('promotionData');
    state.promotionData = JSON.parse(promotionData);
  },
  // 添加至购物车
  [ADD_CART](state, value) {
    let cartData = [];
    const arr = [];
    /**
     * 判断购物车是否有商品
     * 如果有,则追加
     * 如果无,则写入
     */
    if (sessionStorage.getItem('cartData')) {
      cartData = JSON.parse(sessionStorage.getItem('cartData'));
      cartData.forEach((val, index) => {
        arr.push(val.name);
        if (val.name === value.name) {
          cartData[index].number += 1;
        }
      });
      if (arr.indexOf(value.name) < 0) {
        cartData.push(value);
      }
      sessionStorage.setItem('cartData', JSON.stringify(cartData));
    } else {
      cartData = [value];
      sessionStorage.setItem('cartData', JSON.stringify(cartData));
    }
  },
  // 删除购物车商品
  [DELETE_CART_PRO](state, value) {
    const cartData = JSON.parse(JSON.stringify(state.cartData));
    cartData.forEach((val, index) => {
      if (value.name === val.name) {
        cartData.splice(index, 1);
      }
    });
    state.cartData = cartData;
  },
};

export default mutations;

cart => mutation-types

export const GET_CART_DATA = 'GET_CART_DATA';
export const GET_PROMOTION_DATA = 'GET_PROMOTION_DATA';
// 加入购物车操作
export const ADD_CART = 'ADD_CART';

// 删除购物车中商品
export const DELETE_CART_PRO = 'DELETE_CART_PRO';

cart => actions.js

import { DELETE_CART_PRO } from './mutation-types';

const deleteCartPro = async ({ commit }, value) => {
  commit(DELETE_CART_PRO, value);
};

export default {
  deleteCartPro,
};