BattleAX
vuex wrapper for type-safe
Note: This library is Highly Experimental stage.
Examples
see example
Store
- actions.ts
;;;; // define action types. This Object's key is type and value is payload.; ;
- mutation.ts
;;;
- getters.ts
;;; // define getter types; ;
- store.ts
;;;;; // define state; ; // create battle-ax store;
Components
Example use vue-property-decorator.
- index.ts(Application's entry file)
;;; new Vue;
- App.vue(container component)
template div id="app" h1Shopping Cart Example</h1> hr h2Products</h2> product-list :actions="actions" :state="state" :getters="getters" /product-list hr cart :actions="actions" :state="state" :getters="getters"/cart /div/template script lang="ts";;;;; /script
- Cart.vue(presentational component)
template div class="cart" h2Your Cart</h2> p v-show="!products.length"iPlease add some products to cart.</i>/p ul li v-for="p in products" - x /li /ul pTotal: </p> pbutton :disabled="!products.length" @click="checkout(products)"Checkout</button>/p p v-show="checkoutStatus"Checkout .</p> /div/template script lang="ts";;;;; /script
License
MIT © joe-re