我的React.js应用程序中的splice()方法存在一些问题。
因此,这是一个示例应用程序。删除现在不起作用。怎么了 部分代码:
class CardList extends React.Component {
static propTypes = {
students: React.PropTypes.array.isRequired
};
// ADD DELETE FUNCTION
deletePerson(person) {
this.props.students.splice(this.props.students.indexOf(person), 1)
this.setState()
}
render() {
let that = this
return <div id='list'>
{this.props.students.map((person) => {
return <Card
onClick={that.deletePerson.bind(null, person)}
name={person.name}>
</Card>
})}
</div>
}
}
class Card extends React.Component {
render() {
return <div className='card'>
<p>{this.props.name}</p>
{/* ADD DELETE BUTTON */}
<button onClick={this.props.onClick}>Delete</button>
</div>
}
}
你的问题是当你打电话时
onClick={that.deletePerson.bind(null, person)}
您将this
值绑定到null
。所以,你的内部deletePerson
功能this
是null
代替实际的组成部分。您应该将其更改为
onClick={that.deletePerson.bind(this, person)}
并且一切都会按预期工作=)
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句