vuex 中的核心概念及原理

vuex 底層原理：

vuex 推薦map的方式代替原生操作：

VUE核心概念

• state:提供一個響應式資料；

• Getter:藉助Vue的計算屬性computed來實現快取；

• Mutation；更改state方法；

• Action:觸發mutation 方法；

• Module:Vue.set 動態新增state 到響應式資料中；

  1. vuex 中核心原理：通過vue 例項，將state資料賦值給data(){return { $$state:state}}
  2. commit 實際上就是執行mutations 中的某個方法；
  3. 每次訪問State的時候，實際上是訪問了重寫的get 方法；訪問例項中的資料屬性；
  4. ....

精簡核心程式碼如下,當下僅實現commit：

import Vue from 'vue'

const Store =function Store(options={}){
const {state={},mutations={}}=options;
this._vm=new Vue({
	data:{
	$$state:state
	}
});

this._mutations=mutations;
}

Store.prototype.commit=function(type,payload){
// 如果mutations[type]這個方法存在；則執行這個方法；		
if(this._mutations[type]){
	this._mutations[type](this.state,payload);
	}
}

// 向原型上定義屬性；
Object.defineProperties(Store.prototype,{
state:{
	get:function(){
		return this._vm._data.$$state;
	}
}
});	

export default {Store}
複製程式碼

**問題：**這裡為什麼使用this._vm._data 來獲取vue 例項中的響應式資料；