Nextjs: onChange input not change value on self-CodePudding

This is my code:

const [defaultBuy, setDefaultBuy] = useState({
    data: '',
    price: 0
})

const changeBuyPrice = (e: any) => {
    let value = e.target.value
    if (value > 1000) {
        value = 9000
    }
    console.log(value)
    setDefaultBuy({...defaultBuy, price: value})
}

And this is render:

<input defaultValue={defaultBuy.price} name="" type="text" onChange={(e) => changeBuyPrice(e)} />

If I put number larger than 1000 in input, console.log(value) show me 9000.

But <input> tag not show 9000.

I want to change <input> value also

CodePudding user response：

If you want the input to reflect the value in the state then you need to make it a controlled component.

Assign the value in the state to the value prop instead of the defaultValue prop.