Skip to content
master
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

README.md

Weex-x

Flux-inspired-Architecture-Vuex-inspired-Architecture for Weex.

note: this repo only works well with Weex JS Framework v0.16.x and higher.

Install

npm install weex-x

Usage

First you need to create a new Store with some options.

  • state: the real JSON data work in the background.
  • getters: you can define some getters whose value depends on the state.
  • mutations: you can not modify the state directly but can define some mutations to dispatch anytime.
  • actions: you can also define some functions to dispatch those mutations.

For example:

import { Store } in 'weex-x'
const store = new Store({
  state: { firstName: 'Jinjiang', lastName: 'ZHAO' },
  getters: { fullName: state => `${state.firstName} ${state.lastName}` },
  mutations: {
    setFirstName (state, name) {
      state.firstName = name
    },
    setLastName (state, name) {
      state.lastName = name.toUpperCase()
    }
  },
  actions: {
    setFirstName: ({ commit }, payload) => commit('setFirstName', payload),
    setLastName: ({ commit }, payload) => commit('setLastName', payload),
    setFullName({ commit }, payload) {
      const result = payload.split(' ', 2)
      commit('setFirstName', result[0])
      commit('setLastName', result[1])
    }
  }
})

And then just set store to the top Vm options with the store you created and set init to each Vm options. You can access the store by $store in Vms.

import { Store, init } in 'weex-x'
const store = new Store({...})
export {
  store,
  init,
}

If your Vm already has init in its options. You can use it like this:

import { Store, init } in 'weex-x'
const store = new Store({...})
init = init(function () {
  // todo
})
export {
  store,
  init,
}

At last you can quickly define more Vm options with some helpers:

import { Store, init, mapGetters, mapActions } from 'weex-x'
const store = new Store({...})
export {
  store,
  init
}
export const computed = mapGetters([
  'firstName',
  'lastName',
  'fullName'
])
export const methods = mapActions([
  'setFirstName',
  'setLastName',
  'setFullName'
])

Examples

See examples for more.

Contribution

  • npm run build to build generated javascript code to ./dist/
  • npm run dev to watch the ./src/* changes to run the build process
  • npm run test to run test cases
  • in ./examples/ you can npm i && npm run build to build all examples to ./examples/dist/
  • also in ./examples/ you can npm run dev to watch changes of all examples to run the build process

About

No description, website, or topics provided.

Resources

License

Packages

No packages published
You can’t perform that action at this time.