onClick trigger click Error: current.click is not a function

Question

我正在尝试在另一个 onClick 事件函数上触发点击按钮。

Error : Uncaught TypeError: this.clickBack.current.click is not a function

React 版本为 16.8.6

constructor(props) {
    super(props)

    this.clickBack = React.createRef();
    this.startInterview = this.startInterview.bind(this);
}

startInterview(){
    console.log('hello') // output : hello
    console.log(this.clickBack.current); // output : Button {props: {…}, context: {…}, refs: {…}, updater: {…}, onClick: ƒ, …}
    this.clickBack.current.click(); // output : Uncaught TypeError: this.clickBack.current.click is not a function
}

在渲染中 -> return 方法

<Link to={backLink}>
    <Button ref={this.clickBack}> Back</Button>
</Link>
<Button onClick={this.startInterview}> Start Interview</Button>

Answer 1

你可以试试这个：

this.clickBack.current.link.click()

而不是：

this.clickBack.current.click()

Answer 2

正如我们在 console.log 中看到的那样，ref 引用的是 Button 组件，而不是 dom element.If 此 Button 是您定义的组件，您应该将 ref 传递给button dom 元素的道具，例如

<Button innerRef={this.clickBack}...>

Button.js

...
<button ref={this.props.innerRef}

（这里的innerRef是任意名称）

onClick trigger click Error: current.click is not a function

onClick trigger click Error: current.click is not a function

javascript

click

onclick

eventtrigger

reactjs