在React中隐藏输入/文本区域值onChange setState-无需用户输入输入

Question

当隐藏输入 / textArea / TextField的值在反应中更改时，我需要触发一个功能。用户输入值时不行。动态更改隐藏的输入值时，触发一个函数。

import TextField from "@material-ui/core/TextField";

class RowComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      xx: "",
      salary: 0,
    };
  }

  handleChange = (event) => {
    this.setState({
      xx: event.target.value,
    });
  };

  render() {
    const {
      member: { salary },
    } = this.props;

    console.log(this.state.xx);

    return (
      <TextField
        name="HiddenField"
        type="hidden"
        value={this.state.salary !== 0 ? this.state.salary : salary}
        onChange={this.handleChange}
      />
    );
  }
}

Answer 1

onChange不会在这里触发，因为它只会在用户更改输入字段的值（例如，用户输入新字符）时触发。

根据您应用的逻辑，只要value工资，TextField的{​​{1}}就只能由道具控制。状态不等于RowComponent（基于您的0：TextField的这种情况）-这很明显，并且在您使用React Dev浏览状态/道具时更加清楚工具。

所以，您可以做的是比较先前的道具和状态与当前的道具并评估是否更新状态value={this.state.salary !== 0 ? this.state.salary : salary}

xx