摘要：人生，遠(yuǎn)不止是錢。如何管理，一個(gè)更復(fù)雜的人生人生，就是一個(gè)大型應(yīng)用。把復(fù)雜的人間，拆解成了行動與目標(biāo)。所以，，以及和兩個(gè)函數(shù)，就構(gòu)成了的邏輯?，F(xiàn)在，你不僅完全理解了的設(shè)計(jì)哲學(xué)，你更懂得了如何管理人生。

Veux的哲學(xué)，實(shí)質(zhì)上是人生的哲學(xué)。

看一看這張圖。

魂： 你的靈魂，你的心中所想。

形： 你的身體，你的外在形態(tài)。

人間： 你的所作所為，所見所聞。

想一想，人活著不就是如此嗎？

你的靈魂，控制著你的身體。

你的身體，與世界進(jìn)行互動，改變并影響著人間。

人間所發(fā)生的一切，又時(shí)時(shí)刻刻塑造著你的靈魂。

閉上眼睛，跟隨自己去體驗(yàn)：
你心中起了一個(gè)想法，你的身體也隨著這個(gè)念頭去做出行動。 而這個(gè)行動，又改造了你周邊的世界。同時(shí)，你也聽見、看見了人間發(fā)生的事，你的思想你的靈魂在隨之改變。

我們看一個(gè)小型Vue應(yīng)用。

new Vue({
  // 魂(State)：你的心中所想
  data () {
    return {
      money: 0
    }
  },
  // 形(View): 你的外在形態(tài)
  template: `
    
我有這么多錢：{{ money }}
  `,
  // 人間(Action):你的所做所為所見所聞
  methods: {
    earn_money () {
      this.money++
    }
  }
})

現(xiàn)代人似乎把一切都簡化了——只為“錢”。

人活著就淪為了這樣的東西：

魂，即state： 心里只有錢,即money。

形：即view： 有多少錢都炫富出來。

我有這么多錢：{{ money }}

人間： 所做的只有一件事，即賺錢:

earn_money () {
  this.money++
}

閉上眼睛，跟隨自己去體驗(yàn)：
你是一個(gè)純粹為了錢的人。 你心中所想，只有錢。 你的外在表現(xiàn)，就是你有多少錢。你的一切行為，都是為了錢。

如果人真的能活得這么純粹，反倒是好事。

但真實(shí)的人生，往往更復(fù)雜：

賺錢不簡單，你可能需要完成一系列復(fù)雜的工作，才能拿到錢。

有錢，也無法表現(xiàn)出來。但你可以通過穿著、房子、車子，表現(xiàn)出來。

思想更復(fù)雜，你心里遠(yuǎn)不止是錢，錢是為了守住更多的東西，例如尊嚴(yán)、愛情、親情。

當(dāng)面對捉摸不定的思想、深藏不露的人性、變幻莫測的人間...你需要一套處世哲學(xué)。
當(dāng)面對大批量的State，無法直接取值的View，耦合嚴(yán)重的Action的時(shí)候，你就需要Vuex了。

人生，就是一個(gè)大型應(yīng)用。

Vuex就是人的處世哲學(xué)。

當(dāng)你的人生亂成一團(tuán)糟時(shí)，你可以試試用Veux的方式，來梳理自己的生活。

State，就相當(dāng)于你心中在意的事。

那如何去維護(hù)這些State呢？ 錢、父母的健康、愛情，并不是輕輕松松可以得到的，你需要縷清楚之間的關(guān)系。

Vuex把復(fù)雜的“人間”，拆解成了行動(Action)與目標(biāo)(Mutation)。

Mutation，即目標(biāo)，它必須是同步函數(shù)的。 它的功能必須是直截了當(dāng)?shù)?，可以簡單到“讓XX更多”或"讓XX歸零"的程度。

Action，即行動，在其中可以包含異步操作(如Ajax獲取數(shù)據(jù))，并組合一個(gè)個(gè)小目標(biāo)。

View，只能發(fā)起一個(gè)個(gè)行動(dispatch)。

Action，在這里可以執(zhí)行多個(gè)同步/異步函數(shù)、發(fā)起多個(gè)行動(dispatch)，達(dá)成(commit)一個(gè)個(gè)小目標(biāo)。

Mutation, 只能改變state(matate)。

State, 直接影響我的形態(tài)，這是vue的工作，不作表述。

當(dāng)然，我們有時(shí)提取出一些更“有用”的狀態(tài)，相當(dāng)于state的計(jì)算參數(shù)，即

Getters，State的計(jì)算屬性。

所以， Action + Mutation + state， 以及dispatch和commit兩個(gè)函數(shù)，就構(gòu)成了Veux的邏輯。

我們也可以這樣來管理生活

store.js

const store = new Vuex.Store({
  state: {
    money: 10000000,
    energy: 60,
    love: 30,
    parent_health:50
  },
  mutations: {
    earn_money (state) {
      state.money += 1000
    },
    pay_money (state,payload) {
      state.money -= payload.money_cost
      if(state.money < 0) state.money = 0
    },
    restore_energy(state, payload){
      state.energy = state.energy + payload.sleep_hour*10
      if(state.energy > 100) state.energy = 100
    },
    use_energy(state,payload){
        state.energy -= payload.energy_cost
        if(state.energy < 0) state.energy = 0
    },
    be_romantic(state){
        state.love += 10
    },
    enhance_harmony(state){
        state.love += 5
        parent_health += 10
    }
  },
  actions: {
    async work({commit}){
       commit("use_energy")
       await wait(8)
       commit("earn_money")
    },
    send_gift({commit}){
        commit("pay_money",{money_cost:10000})
        commit("be_romantic")
    },
    async family_walk({commit}){
        commit("use_energy",{energy_cost = 10})
        await wait(1)
        commit("enhance_harmony")
    }
    async sleep({commit}) {
        await wait(8)
        commit("restore_energy")
    },
    async dating({dispatch, state}){
        dispatch("send_gift")
        if(state.love >80){
            await dispatch("sleep")
        }
    }
  },
  getters(){
      location: (state)=>{
          return state.money>10000000 ? 4 : state.money>5000000 ? 5: null
      },
      walk_time: (state)=>{
          return Math.min(energy, parent_health)
      }
  }
})

module.exports = store

首先，在app.js中導(dǎo)入vuex

import Vue from "vue"
import App from "./components/App.vue"
import store from "./store"

new Vue({
  el: "#app",
  store,
  render: h => h(App)
})

之后，在編寫.vue文件時(shí)，利用mapState, mapGetters, mapActions, 可以訪問到StateGettersActions

注意：
mapState和mapGetters必須在computed中訪問，因?yàn)樗鼈兎祷氐氖菍ο?，所以需要用拓展?..進(jìn)行展開。

mapActions則是將Action掛載到methods上，也需要用拓展符...進(jìn)行展開。

成功學(xué)中有兩個(gè)很重要的概念，叫“目標(biāo)導(dǎo)向” “階段性執(zhí)行”，回頭來看，不正是Veux的哲學(xué)嗎？

Mutation目標(biāo)導(dǎo)向: 設(shè)定簡單的目標(biāo)，改變State

Action階段性執(zhí)行： 執(zhí)行一個(gè)個(gè)Matation、異步函數(shù)、和其它階段性執(zhí)行。

現(xiàn)在，你不僅完全理解了Veux的設(shè)計(jì)哲學(xué)，你更懂得了如何管理人生。

你可以問自己三個(gè)問題：

梳理思緒： 我心中最在意的事。

設(shè)立目標(biāo)：這些最在意的事，會發(fā)生怎樣改變？

創(chuàng)建行動：連接一個(gè)個(gè)小目標(biāo)，形成你要做的行動。

然后，行動吧！ 只要做正確的事，你所期待的，就一定會發(fā)生！