我應該為輸入字段使用受控制的React組件（安全性明智）嗎？

Question

我為密碼輸入字段創建了一個React控制組件：

onPasswordChange(ev) {
  this.setState({
    passoword: ev.target.value
  });
}

<input
  value={this.state.password}
  onChange={this.onPasswordChange}
>

正如您在下圖中看到的那樣，如果組件被控制，我可以看到密碼值，如果我去檢查元素。 我的問題是：這是控制密碼輸入的正確方法嗎？ （安全明智）。

我知道我可以在輸入字段上使用ref = {}但我想知道處理密碼字段的最佳實踐。

Answer 1

這是一個有趣的問題，但我認為這不是一個問題。 根據我的知識，如果您可以通過使用document.getElementById('passwordInputId').value來訪問檢查器，我認為您始終可以訪問輸入字段的document.getElementById('passwordInputId').value 。例如。 密碼類型已設置，以便您身后的人無法看到您正在撰寫的內容。 這是我所說的一個很好的例子 。

所以你應該使用帶有狀態的受控組件，因為這是React建議的方式，最好避免引用 。