javascript - React - 使用状态之外的函数设置组件状态，这是错误的吗？

Question

在 React 组件之外的函数中使用 setState 有错吗？

例子:

// myFunction.js
function myFunction() {
  ...
  this.setState({ ... })
}

// App.js
import myFunction from './myFunction

class App extends Component {
  constructor() {
    super()
    this.myFunction = myFunction.bind(this)
  }

  ...
}

Answer 1

我不确定你绑定(bind)的方式是否真的有效。您可以执行以下操作:

export const getName = (klass) => {
  klass.setState({ name: 'Colin'})
}

然后

class App extends Component {
  state = {
    name: 'React'
  };

  handleClick = () => {
    getName(this);
  }

  render() {
    return (
      <div>
        <p>{this.state.name}</p>
        <button onClick={this.handleClick}>change name</button>
      </div>
    );
  }
}

工作示例 here .