如何防止反应中的状态更新无限循环

Question

>我将数据从子组件传递到父组件，但它没有设置在状态中。 当我尝试设置状态时，它给了我一个错误

"超出最大更新深度。当组件在 componentWillUpdate 或 componentDidUpdate 中重复调用 setState 时，可能会发生这种情况。React 限制嵌套更新的数量以防止无限循环。"

class Listing extends Component {
state = {
list: ''
}
update = (data) => {             
this.setState({list: data }) 
}
render() {
return (
<Pagination
data={this.update}
/>
)
}
}

import React, { Component } from 'react';
export class Pagination extends Component {
state = {
page : this.props.page,
count : 0,
perPage: this.props.perPage
}  
render() {
const { page, count, perPage} = this.state
const dataForParent = Object.values(page).slice(count*perPage, count*perPage+perPage);
this.props.data(dataForParent)
return (
<div className="project-pagination m-top-30">
</div>
)
}
}

Answer 1

使用此代码

class Listing extends Component {
state = {
list: {}
}
update = (data) => {
setTimeout(() => {
this.setState({list: {...data} })
}, 1000)
}
componentDidMount(){
this.update()
}
render() {
return (
<Pagination
data={this.update}
/>
)
}
}