umi
umi copied to clipboard
[Feature Request]在class component中使用usemodel,用injectModel 代替 connect,或者并存
Background
想页面用class component,方便页面继承;而具体模块用function component。在class component 中使用usmodel的能力;
本来connect就是干这个事,但是新手可能不能直观理解connect的作用。用injectModel命名可能更能表达相似的意义
Proposal
在class component 中使用usmodel到的能力,方便新手在不同组件里使用qiankun 和umi 的useModel能力
Additional context
类似一个高阶函数,ts可以用装饰器
function injectModels(...models: string[]) {
return (WrappedComponent) => {
return (props) => {
const data = {};
models.forEach((modelName) => {
return data[modelName] = useModel(modelName);
});
return <WrappedComponent {...props} {...data} />;
};
};
}
export default injectModels;
主要是方便,比如,同时兼容一些老项目风格代码
@injectModels('@@initialState','@@qiankunStateFromMaster')
class Page extends ....
componentDidMount(){
const user = this.props['@@initialState'].user;
...
}
connect比较既好又烦的地方是考虑了命名冲突等很多能力,但是这要在组件里写一个变量名字两遍,很麻烦。 东西先用起来简单,好用,然后别人才会学习相关的延伸能力。
connect我感觉可以简化,有冲突的时候报个错,推荐个推荐写法就好了