Question

我正在尝试从导入的命名组件中更改类的状态，因此我只需要编写一次代码。这有可能吗？

我有3个文件（Login，ForgotPassword，Register）。在所有这些文件上，我都在监听输入字段中的“ onChange”事件，这些事件都具有与以下所示相同的作用：

onChange方法：

onChange = (e) => {
    this.setState(() => ({ errors: {} }));

    let fields = this.state.fields;
    fields[e.target.name] = e.target.value;
    this.setState(() => {
        return {
            fields
        }
    });
};

我真的很想将此方法作为已命名方法以及其他已经在使用的方法导入：

import { onFocus, onBlur, onChange } from './Utils/Input';

问题是（如上面的onChange代码所示），我需要从此方法更新类状态。

这有可能吗？我对React很陌生，所以我可能会以完全错误的方式进行操作。

提前谢谢！

Answer 1

通过这样的方法从类内部将上下文绑定到该方法上

onChange.bind(this)

Answer 2

当尝试更新组件的状态时，您总是在更新与特定组件有关的状态。

您正在尝试编写独立于所使用实例的*函数。因此，在其中使用“ this”是没有意义的。

您可以像这样将Class的实例传递给启用函数：

https://codesandbox.io/s/focused-cache-zzfvp

从ReactJS中的导入函数更改类状态

2 个答案: