在redux状态管理的组件中与Primreact DataView组件作斗争

Question

我正在尝试利用Primreact DataView，问题是我的数据是使用操作从后端加载的。以下是我的代码，稍后将解释我的目标。

export const getFinishedProjects = () => dispatch => {
axios.get(finishedProjectsURL)
.then(res => {
dispatch({
type: GET_FINISHED_PROJECTS,
payload: res.data
});
}).catch(err => console.log(err))
}
componentDidMount() {
this.props.getFinishedProjects();
}  

<div className="dataview-demo">
<div className="card">
<DataView 
value={this.props.finishedprojects} 
layout={this.state.layout} 
header={header}
lazy
itemTemplate={this.itemTemplate} 
paginator 
paginatorPosition={'both'} 
rows={this.rows}
totalRecords={this.state.totalRecords} 
first={this.state.first}  
/>
</div>
</div>
const mapStateToProps = state =>({
finishedprojects : state.finishedprojects.finishedprojects
})
export default connect(mapStateToProps, {getFinishedProjects} ) (FinishedProjects);

现在文档中的问题是，我认为这两个函数用于加载数据

componentDidMount() {
setTimeout(() => {
this.productService.getProducts().then(data => {
this.datasource = data;
this.setState({
totalRecords: data.length,
products: this.datasource.slice(0, this.rows),
loading: false
});
});
}, 1000);
}
onPage(event) {
this.setState({
loading: true
});
//imitate delay of a backend call
setTimeout(() => {
const startIndex = event.first;
const endIndex = event.first + this.rows;
this.setState({
first: startIndex,
products: this.datasource.slice(startIndex, endIndex),
loading: false
});
}, 1000);
}

在我的方法中，我似乎得到了以下错误：错误：DataViewItem(…(：渲染没有返回任何内容。这通常意味着缺少返回语句。或者，要不呈现任何内容，请返回null。

我的假设是，也许这与我如何从后端加载数据有关。如果是这样的话，也许有人会帮助我如何模仿那些类似文档的函数并在DataView中呈现数据。提前感谢

Answer 1

不知怎么的，PrimeReact附带的分页器就是造成我的问题的原因。所以我设置了paginator={false}，Dataview又开始工作了。我仍在调试它，但与此同时，你可以通过禁用分页器来测试你的数据是否正常工作，如果Dataview不工作，那么你的数据可能不是正确的格式，因为Dataview需要一个对象数组。