光标退格不会删除反应中数字格式的最后一个字符答案

【问题标题】：The cursor backspace doesn’t remove last char of number format in react光标退格不会删除反应中数字格式的最后一个字符
【发布时间】：2020-08-07 14:30:55
【问题描述】：

我是新来的反应。例如，输入值输入 1,2,3,4 并且在事件 onChange 之后它只需要数字，那么我可以用退格键删除 4,3,2 而不是 1。在 HTML DOM 中也不能删除 1。

 class House extends Component {

    state = {
        room: null,
      };

    componentDidMount() {

        if (this.props.house.rent) {
          this.setState({ rent: this.props.house.rent });
        }
      }

         onChange = (field, value, mutate) => {
            if (field === "houseroom") {
              value = parseInt(value.replace(/[@,]/g, ""));

            }

         mutate({
              variables: {
              },
            });
 this.setState({
      [field]: value,
    });
          };


            render(){
     const {house} = this.props;
             <SomeInput

                        type="text"
                        value={
                          (house.room&&
                            `$${house.room.toLocaleString("en")}`) ||
                          ""
                        }
                        onChange={e => {
                          e.target.placeholder = "Room";
                          this.onChange("houseroom", e.target.value, mutate);
                        }}

        }
        />

    }

【问题讨论】：

输入标签的值字段是什么？它来自州吗？
不，它是对象格式，我无法使用状态。例如并且如果 value={room} 采用这种格式，那么它适用于其他没有状态的示例。
嗨，Vishal，请分享正在呈现输入的组件，以便我们更好地帮助您
好的更新了我的问题。谢谢

标签： reactjs react-apollo

【解决方案1】：

在状态更新期间看起来有很多问题可能是由于组件中其他地方的过度渲染尝试使用 prevState 代替确保状态更新不会冲突。

this.setState(prevState => {
             [field]:value; 
    });

让我与结果保持联系。

【讨论】：

Nope Mr.Thibault。实际上我认为的主要问题是，我无法创建这个：render(){ const {house.room} = this.state; //这给出了错误作为意外令牌，并且预期为“，但如果我使用render（）{const {house} = this.state; // 这没有错误。所以我的问题是如何为 {house.room} 创建一个 this.state 。谢谢

【解决方案2】：

希望这对某人有所帮助！需要在输入值中提及“this.state.room”并使用 componentDidUpdate 检查上一个状态，然后在此处使用“this.setState”，最后在事件更改期间使用“this.setState”。谢谢大家

【讨论】：