1.在config.js中配置dva
export default defineConfig({
...,
monorepoRedirect: { peerDeps: true },
dva:{} //開(kāi)啟dva
})
2.在src中創(chuàng)建models文件并新建文件
models/documentChange.ts文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-523793.html
export default {
// models命名空間,需全局唯一
namespace: 'documentChange',
// models存儲(chǔ)的數(shù)據(jù)store
state: {
dataList: 1,
hasdetailRow:false
},
// 更新store,用新數(shù)據(jù)合并state的舊數(shù)據(jù)
reducers: {
save(state, { payload }) {
return { ...state, ...payload };
}
},
}
3.在組件中使用
import { connect } from 'dva';
const RequirementDetails: React.FC<{
headerInfoRef:any
}> = (props) => {
const { headerInfoRef } = props
const click = (() => {
// 通過(guò)dispatch 調(diào)用文件下的save 改變dva 下 system 的 state的狀態(tài)值
props?.dispatch({
type: 'documentChange/save', // type,命名空間/reducers方法名
payload: {
hasdetailRow: props.documentChange.dataList++// payload,參數(shù)
},
});
})
return (
<>
{/* 查看設(shè)置的值 */}
{JSON.stringify(props.documentChange.dataList)}
<div onclick={click}>切換值</div>
</>
);
};
// documentChange 對(duì)應(yīng)models命名空間
export default connect(({ documentChange }) => ({ documentChange }))(RequirementDetails);
文章來(lái)源:http://www.zghlxwxcb.cn/news/detail-523793.html
到了這里,關(guān)于umi4使用狀態(tài)管理dva的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!