reactjs - ReactJS react-step-wizard 在动画后关注输入

Question

我使用这个包https://www.npmjs.com/package/react-step-wizard在表单之间制作动画。每个表单都是独立的组件。

完成幻灯片动画后如何将焦点设置为活动形式的输入？

标签： reactjs

Answer 1

您是否尝试过componentdidmount？

像这样的东西？

class App extends React.Component{
  componentDidMount(){
    this.nameInput.focus();
  }
  render() {
    return(
      <div>
        <input 
          defaultValue="Won't focus" 
        />
        <input 
          ref={(input) => { this.nameInput = input; }} 
          defaultValue="will focus"
        />
      </div>
    );
  }
}