Question

我正在尝试做一些简单的事情：我希望我的子组件触发在我的父组件中找到的函数，并且我理解正确的方法是使用道具。

在下面的Codepen中，您可以找到一个示例：

基本上我想要实现的是将“嘿”打印到控制台。

这是我的代码：

(use-package evil
 :ensure t
 :config
 (evil-mode 1)
 (define-key evil-insert-state-map "jj" 'evil-normal-state)
)

感谢您的帮助！

Answer 1

您不需要onClickAdd功能。只需直接点击this.props.addItem onClick（通知，没有parens）你传下来。

 class Form extends React.Component {
  constructor(props){
    super(props);
  }

  render(){
    return(
      <div>
        <button onClick={this.props.addItem}>Add</button>
      </div>
    )
  }
}

class App extends React.Component {
  constructor(props){
    super(props);
  }

  addItem(){
    console.log('hey');
  }

  render() {
    return (
      <div>
        <Form addItem={this.addItem} />
      </div>
    );
  }
}

ReactDOM.render(<App />, document.getElementById('app'));

使用props从子级触发父函数

1 个答案: