javascript - 使用键的字符串更新 setState

Question

这个问题已经有答案了:

How to use a variable for a key in a JavaScript object literal? (16 个回答)

已关闭 6 年前。

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

关于 componentDidMount我运行以下函数:

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

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

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

请参阅下面的完整代码以了解更多上下文。

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() {
    ........
  }
}

Answer 1

您可以将其括在方括号中以实现您想要的效果。

var testing = "testable";

var test = {
	[testing]: "value in [testing]"
};

document.getElementById("value").innerText = test.testable;

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