Question

我正在使用react-bootstrap-validation来验证输入字段。我想要根据点击设置一些输入字段。我知道我需要直接设置状态而不是DOM，但在这种情况下不确定如何。

具体来说，我想在this line in the onClick handler上设置我正在使用console.log的字段。

相关代码：

generateKeys() {
  console.log('generating keys...');
  let keyPair = tweetnacl.sign.keyPair();
  let publicKey = tweetnacl.util.encodeBase64(keyPair.publicKey);
  let secretKey = tweetnacl.util.encodeBase64(keyPair.secretKey);
  let encryptedSecretKey = CryptoJS.AES.encrypt(secretKey, 'superfreak').toString();
  console.log(publicKey);
  console.log(secretKey);
  console.log(encryptedSecretKey);
}

render() {
...
  <p>Don't have your own keys? Generate a once-off pair by clicking <a href="#" onClick={this.generateKeys} >here</a>.</p>
  <ValidatedInput
    type='text'
    label='Your public key'
    name='publicKey'
    validate='required'
    errorHelp='Please paste in your public key here'
  />
...

关于最佳方法的想法？

感谢。

Answer 1

ValidatedInput似乎从Input延伸，因此您可以使用此组件的value属性来设置值。

你可以在generateKeys方法中尝试这样的事情：

generateKeys() {
  ...
  this.setState({publicKeyValue: publicKey});
  ...
}

然后使用publicKeyValue状态设置值：

<ValidatedInput
  type='text'
  label='Your public key'
  name='publicKey'
  validate='required'
  errorHelp='Please paste in your public key here'
  value={this.state.publicKeyValue}
/>

如何在ReactJS中手动设置输入值？

1 个答案: