Новинка реагирует на угловой Получение ошибки:
The above error occurred in the <div> component: in div
Consider adding an error boundary to your tree to customize error handling behavior.
Я не совсем понимаю, почему div и о чем идет речь в ошибке? Я пытаюсь щелкнуть строку и передать значения из строки в родительский. В моем родительском компоненте верхнего уровня у меня есть функция, которая устанавливает значение выбранной строки, а в дочернем элементе выбранная строка передается реквизитам.
Родитель:
class Parent extends React.Component {
constructor(props) {
super(props)
this.state = {
activeItem: []
}
this.setActiveItem = this.setActiveItem.bind(this)
}
setActiveItem = userSelect => {
this.setState({ activeItem: userSelect })
}
render(){
<Child activeItem = {this.setActiveItem}/>
}
В моем ребенке я использую ag-grid с помощью onRowClicked. Ошибка возникает в this.props.setActiveItem(event.data)
class Child extends React.Component {
constructor(props) {
super(props)
}
onRowClicked = event => {
//eslint-disable-next-line no-console
console.info('tester', event.data) //okay, shows data
this.props.setActiveItem(event.data) //not okay, throws error
}
grid = () => {
return (
<AgGridReact
columnDefs = {this.state.columnDefs}
rowData = {this.state.data}
onRowClicked = {this.onRowClicked}
/>
)
}
render() {
if (this.state.data.length > 0) {
return <div className = "ag-mod">{this.grid()}</div>
}
return <br />
}
}
//also here's the prop for child
Child.propTypes = {
setActiveItem: PropTypes.func
}





Вы передаете setActiveItem от родителя к дочернему как activeItem.
<Child activeItem = {this.setActiveItem}/>
Поэтому в детстве назовите его тем именем, которое вы дали при передаче.
onRowClicked = event => {
//eslint-disable-next-line no-console
console.info('tester', event.data) //okay, shows data
this.props.activeItem(event.data) //not okay, throws error
}
Кроме того, подумайте о том, чтобы заключить ваши компоненты в границу ошибки, как указано в ошибке. Помогает. Вы можете прочитать об этом здесь
Все еще смотрю на ваш код, но я заметил, что вы привязываете метод setActiveItem к родительскому элементу. Поскольку этот метод создается с использованием стрелочной функции es6, вам не нужно выполнять this.setActiveItem = this.setActiveItem.bind (this) в родительском конструкторе. Попробуйте удалить это.