如何从 antd Input.Password 获取用户输入？

Question

我正在尝试从 antd input.password 字段获取用户输入。有可能吗？

我没有看到任何关于 antd 文档的信息。不知道有没有可能

我期待用户 input.password 的字符串，因为我会将它们保存到本地存储中

Answer 1

您始终可以使用 onChange 方法，例如 onChange={e => console.log(e.target.value) }

代码沙盒：https://codesandbox.io/s/5283xn4vo4

import React from "react";
import ReactDOM from "react-dom";
import "antd/dist/antd.css";
import "./index.css";
import { Input, Button } from "antd";

class PasswordToLocalStorage extends React.Component {
  state = {
    password: undefined
  };

  render = () => {
    return (
      <React.Fragment>
        <Input.Password
          onChange={e => this.setState({ password: e.target.value })}
          placeholder="Enter Password"
        />
        <Button
          onClick={() => {
            if (this.state.password) {
              localStorage.setItem("password", this.state.password);
              alert("saved to local storage: " + localStorage.password);
            } else {
              alert("There is no password to save");
            }
          }}
        >
          Save to localStorage
        </Button>
      </React.Fragment>
    );
  };
}

ReactDOM.render(
  <PasswordToLocalStorage />,
  document.getElementById("container")
);