问题描述
在antdpro中使用dva 的@connect给组件注入props,组件取打印this.props查看注入的值为undefined;
问题出现的环境背景及自己尝试过哪些方法
组件代码
@connect(({ testData, loading }) => ({
testData,
loading: loading.effects['test/fetchTestData'],
}))
class Test extends React.Component {
state = {
data: []
}
componentDidMount() {
const { dispatch } = this.props;
dispatch({
type: 'test/fetchTestData'
});
}
render() {
console.log(this.props)//输出为注入的Props值为undefined
...
models代码
import { queryTestData} from '@/services/api';
export default {
namespace: 'test',
state: {
testData:[]
},
effects: {
*fetchTestData({ payload }, { call, put }) {
const response = yield call(queryTestData, payload);//fetch请求
console.log(response)//成功获取mock数据
yield put({
type: 'getData',
payload: response,
});
},
},
reducers: {
getData(state, { payload }) {
console.log(state,payload) //此处已打印出上面请求的市局
return {
...state,
...payload,
};
},
},
};
已解决,从@connect里结构数据出来的时候,接收的参数是意namespace:...,来划分的;
所以将
@connect(({ testData, loading }) => ({
testData,
loading: loading.effects['test/fetchTestData'],
}))
改成
@connect(({ test, loading }) => ({
test,
loading: loading.effects['test/fetchTestData']
}))