banggood-store
Version:
bang data store
207 lines (180 loc) • 4.54 kB
Markdown
brain-store
### use
```
import {Store,resource,IResource} from 'banggood-store';
const user:IResource = resource('PMS/User');
export default class StoreBase extends Store {
static meta = {
...Store.meta,
namespace: 'bang.portal'
}
context:any
constructor(context){
super(context)
}
}
class Counter extends StoreBase {
completed:string;
name: string;
get fullName() {
return `${this.name} new`;
}
setCompleted(value) {
this.completed = value;
}
setName(value) {
this.name = value;
}
}
class ContainerStore extends StoreBase{
static meta={
...StoreBase.meta,
eventScopes:[user],
contextTypes:{
CounterApp:Counter,
}
}
_title='';
get name():string{
return this._title
};
constructor(context){
super(context);
}
contextCounterStore():Counter{
return this.context.CounterApp
}
triggerEvent(payload) { //事件广播,批量修改store里面数据状态 在相应store里面定义onEvent 函数并且eventScopes值设为user
this.context.dispatch(user.created,payload);
}
setName(value) {
this._title = value;
}
}
class UserListStore extends StoreBase {
static meta = {
...StoreBase.meta,
eventScopes: [user],
};
getContextAppStore() {
// return this.context.app;
}
payloadModel = null;
onEvent(event) {
if(typeof event.payload==='object'){
Object.keys(event.payload).forEach(key =>{
this[`${key}`] = event.payload[key];
});
}
else {
this.payloadModel = event.payload;
}
}
}
--- angular -----
import { Component,OnInit,OnChanges,SimpleChange,EventEmitter,Output } from '@angular/core';
import ContainerStore from './store/ContainerStore';
import {bind} from 'banggood-store'
export class AppComponent {
store:ContainerStore
constructor(){
console.log(this)
}
onVoted(agreed: boolean) {
this.store.setName('设置mobx');
}
}
```
### observablePromise
```
我们所有服务端数据结构都用此类构造出来
```
### MapperEntity&JsonProperty
## 介绍(Introduction)
背景:对于单页应用,数据源是从API服务器获得的。 我们不用直接使用api数据。这时就需要适配器层赖根据需要转换数据。
此外,该适配器与API服务器的数据依赖关系相反(API Server被视为不可控制的非常不可靠,因为数据结构可能由后端
编码器为某些特定目的编辑)到我们的适配器这变得可靠。 因此,该库被创建为适配器。
### USING
```bash
npm install json-mapper-object --save
or
yarn add json-mapper-object
```
### Example
import {MapperEntity,JsonProperty} from 'json-mapper-object';
```bash
class Student {
fullName=void 0;
constructor() {
}
}
class Address {
firstLine=void 0;
secondLine=void 0;
student=void 0;
city=void 0;
constructor() {
}
}
class Person {
name=void 0;
age=void 0;
surname=void 0;
age=void 0;
addressArr=void 0;
address=void 0;
constructor() {
}
}
```
现在这里是API服务器返回的数据,假设它已经被解析为JSON对象。
```bash
let json = {
"Name": "Mark",
"xing": "Galea",
"age": 30,
"AddressArr": [
{
"first-line": "Some where",
"second-line": "Over Here",
"city": "In This City",
"student": {
name1: "Ailun"
}
},
{
"first-line": "Some where",
"second-line": "Over Here",
"city": "In This City",
"student": {
name1: "Ailun"
}
}
],
"Address": {
"first-line": "Some where",
"second-line": "Over Here",
"city": "In This City",
"student": {
name: "Ailun"
}
}
```
只需使用以下代码即可映射。 该映射基于装饰器元数据。
```bash
const person = MapperEntity(Person, json);
```