Question

当我尝试拨打onClick函数<li onClick={this.props.selectItem.bind(this, item.id)} key={index}>时，我收到此错误：

export default class List extends React.Component {
    getState(props) {
        const key = props.params.key;
        return {
            key : key,
            list: Store.getList()
        }
    }

    constructor(props) {
        super(props);
        this.state = this.getState(props);
    }

    renderList(item, index) {
        return <li onClick={this.props.selectItem.bind(this, item.id)} key={index}>{item.name}</li>;
    }

    render() {
        return (
            <ul>
                {this.state.list.map(this.renderList.bind(this))}
            </ul>
        )
    }
}

我有父母：

export default class App extends React.Component {
    selectItem(item) {
        alert(item);
    }

    render() {
        return (
            <div>
                <List selectItem={this.selectItem} params={someParams} />
            </div>
        );
    }
}

Answer 1

从父组件传入绑定方法时，您必须为null传递this而不是bind。

因此this.props.selectItem.bind(this, item.id)变为this.props.selectItem.bind(null, item.id)。

Answer 2

在构造函数中，执行this.renderList = this.renderList.bind（this）;

未捕获的TypeError：无法读取undefined的属性'bind'

2 个答案: