react-redux-helper-tools
v0.0.12
Published
让react-redux像vuex一样轻松,使用起来很动感丝滑
Downloads
4
Readme
第一步,在view/login目录下创建model.ts,并暴露出去
import {ReactModelHelper } from "react-redux-helper-tools";
export default ReactModelHelper({
state: {
loading: false
},
action: {
loginAction(params: any): Promise {
//this.dispatch({type: 'updateState', params: {loading: true}})
//this.dispatch({type: 'updateState', params: {loading: false}})
return new HttpTrigger(this.dispatch).exec('Login', params, 'loading').then((res: any) => {
Message.success('登录成功');
})
}
},
namespace: 'loginModel'
})
第二步,store引入
import LoginStore from 'src/view/v-login/model';
const rootReducers = combineReducers({
LoginStore
});
export const store = createStore(rootReducers);
第三步,tsx页面使用
import { ModelHelperXoo, getNamespaceModel } from "react-redux-helper-tools";
3.1 创建component,并使用ModelHelperXoo函数初始化
class Login extends React.Component {
constructor(props){
this.loginModel = getNamespaceModel('loginModel', this);
}
}
//'LoginStore.loading.subLoading' subLoading为页面使用的别名,如:{this.props.subLoading}这么来使用
export default ModelHelperXoo(['LoginStore.loading.subLoading'], ['loginModel'], Login);
3.2 在constructor中获取到model
this.loginModel = getNamespaceModel('loginModel', this);
3.3 点击提交登录
this.loginModel.loginAction({})
---------------------------------QQ:276034602,加我请备注。--------------------------------------