Question

我有一个包含输入框的react组件。我想确保输入框不为空。

在componentDidMount上运行以下功能：

this.validateInputLength(this.state.first_name, 'firstNameValid');

如您所见，我传递了this.state.first_name的值和字符串'firstNameValid'。

问题是'firstNameValid'没有设置组件的状态。 I was under the impression我可以将状态对象的键作为字符串传递，它会更新，但这似乎不起作用。

有关更多背景信息，请参阅下面的完整代码。

＆＃13;

class Test extends Component {

  constructor(props) {
    super(props)

    this.state = {
      first_name: '',
      last_name: '',
      firstNameValid: true,
      lastNameValid: true
    };
  
    this.validateInputLength = this.validateInputLength.bind(this);
  }

  componentDidMount() {

    this.validateInputLength(this.state.first_name, 'firstNameValid');
    this.validateInputLength(this.state.last_name, 'lastNameValid');

  }


  validateInputLength(value, inputType) {

    if (value.length <= 0) {

      this.setState({
        inputType: false
      });

    } else {

      this.setState({
        inputType: true
      });

    }
  }

  render() {
    ........
  }
}

＆＃13;

Answer 1

您可以将其包装在方括号中，以实现您所追求的目标。

var testing = "testable";

var test = {
	[testing]: "value in [testing]"
};

document.getElementById("value").innerText = test.testable;

<p id="value"></p>

使用键的字符串更新setState

1 个答案: