JSFiddle - React, Tailwind, and code Playground

by fsy0718

HTML

<script src="https://unpkg.com/vue@2.3.3/dist/vue.js"></script>
<script src="https://unpkg.com/vuex"></script>
<script src="https://unpkg.com/vuex-mapstate-modelvalue-instrict"></script>
<div id="app">
  <input v-model="test" />
  <input v-model="test2" />
  <input v-model="objMsg" />
</div>

Babel + JSX

const store = new Vuex.Store({
	strict: true,
	state: {
  	test: 'this is test',
    test2: 'this is test2',
    obj: {
   		msg: 'this is obj.msg'
    }
  },
  mutations: {
  	info (state, value) {
    	state.test = value
    },
    updateObjMsg (state, value) {
    	state.obj.msg = value
    },
    updateTest2 (state, value){
    	state.test2 = value
    }
  }
})

let computed = {
	// some methods in here
}
const modelToStates = MapStateModelValueInStrict.mapStateModelValuesInStrict([
	['test', 'test', 'info'],
  ['test2', 'test2', 'updateTest2'],
  ['objMsg', '随便写用getFn来获取值', 'updateObjMsg', {getFn: function(state, modelName, stateName, modulePath){
  	console.log(arguments)
    return state.obj.msg;
  }}]
])
computed = Object.assign({}, computed, modelToStates)
console.log(computed)
new Vue({
	el: '#app',
  store,
  computed,
  updated: function(){
  	console.log(this.$store.state)
  }
})