點選新增事件：

addToShopCar(){
    var goodsinfo = {
        id: 商品的id,
        count: 要購買的數量,
        price: 商品的單價,
        selected: false 或 true
    };

    // 呼叫 store 中的 mutations 來將商品加入購物車
    this.$store.commit("addToCar", goodsinfo);
}

vuex 公共購物車資料操作：

關於 vuex

點選加入購物車，把商品資訊，儲存到 store 中的 car 上
分析：

1. 如果購物車中，之前就已經有這個對應的商品，那麼，只需要更新數量
2. 如果沒有，則直接把商品資料，push 到 car 中即可

// 每次剛進入網站，肯定會呼叫 main.js 在剛呼叫的時候，先從本地儲存中，
// 把購物車中的資料讀出來，放到 store 中
var car = JSON.parse(localStorage.getItem('car')||'[]');

var store = new Vuex.Store({
  state: {
    // this.$store.state.*** 放進元件
    car: car 
    // 將 購物車中的商品的資料，用一個數組儲存起來，在 car 陣列中，
 

    // 儲存一些商品的物件， 咱們可以暫時將這個商品物件，設計成這個樣子   
    // { id:商品的id, count: 要購買的數量, price: 商品的單價，selected: false  }
  },
  mutations: { 
  	// this.$store.commit('方法的名稱', '按需傳遞唯一的引數')
    addToCar(state, goodsinfo) {
      // 假設 在購物車中，沒有找到對應的商品
      var flag = false

      state.car.some(item => {
        if (
 
item.id == goodsinfo.id) {
          item.count += parseInt(goodsinfo.count)
          flag = true
          return true
        }
      })

      // 如果最終，迴圈完畢，得到的 flag 還是 false，則把商品資料直接 push 到 購物車中
      if (!flag) {
        state.car.push(goodsinfo)
      }

      // 當 更新 car 之後，把 car 陣列，儲存到 本地的 localStorage 中
      localStorage.setItem('car', JSON.stringify(state.car))
    },
    updateGoodsInfo(state, goodsinfo) {
      // 修改購物車中商品的數量值
      // 分析： 
      state.car.some(item => {
        if (item.id == goodsinfo.id) {
          item.count = parseInt(goodsinfo.count)
          return true
        }
      })
      // 當修改完商品的數量，把最新的購物車資料，儲存到 本地儲存中
      localStorage.setItem('car', JSON.stringify(state.car))
    },
    removeFormCar(state, id) {
      // 根據Id，從store 中的購物車中刪除對應的那條商品資料
      state.car.some((item, i) => {
        if (item.id == id) {
          state.car.splice(i, 1)
          return true;
        }
      })
      // 將刪除完畢後的，最新的購物車資料，同步到 本地儲存中
      localStorage.setItem('car', JSON.stringify(state.car))
    },
    updateGoodsSelected(state, info) {
      state.car.some(item => {
        if (item.id == info.id) {
          item.selected = info.selected
        }
      })
      // 把最新的 所有購物車商品的狀態儲存到 store 中去
      localStorage.setItem('car', JSON.stringify(state.car))
    }
  },
  getters: { // this.$store.getters.***
    // 相當於 計算屬性，也相當於 filters
    getAllCount(state) {
      var c = 0;
      state.car.forEach(item => {
        c += item.count
      })
      return c
    },
    getGoodsCount(state) {
      var o = {}
      state.car.forEach(item => {
        o[item.id] = item.count
      })
      return o
    },
    getGoodsSelected(state) {
      var o = {}
      state.car.forEach(item => {
        o[item.id] = item.selected
      })
      return o
    },
    getGoodsCountAndAmount(state) {
      var o = {
        count: 0, // 勾選的數量
        amount: 0 // 勾選的總價
      }
      state.car.forEach(item => {
        if (item.selected) {
          o.count += item.count
          o.amount += item.price * item.count
        }
      })
      return o
    }
  }
})