我有一個組件想用它來更新數據庫中的“余額”。為此,我使用 axios.get 將圖形拉到我的 componentDidMount 中:componentDidMount() { axios.get("/api/fetch/fetchEditDebt", { params: { id: this.props.match.params.id } }) .then((response) => { this.setState({ balance: response.data.balance, }) })}然后我有一個輸入,它獲取用戶想要添加到余額中的金額:<form method="POST" onSubmit={this.onSubmit}> <input className="edit-balance-input" type="number" name="add" value={this.state.add} onChange={this.onChange} step="1" /> <button className="edit-balance-button" type="submit">Save</button></form>然后,我使用一個函數從狀態中獲取原始余額,并從輸入狀態中獲取“添加”數字,并將它們加在一起:const calculateUpdatedBalance = () => { return parseInt(this.state.balance) + parseInt(this.state.add)}然后,更新后的數字將呈現在跨度內,以便用戶可以看到新的余額:<div className="edit-balance-balance-container"> <p className="edit-balance-balance-paragraph">Updated balance: </p> <span className="edit-balance-updated">-£{calculateUpdatedBalance()}</span></div>這一切都很好,正如預期的那樣 - 當我想將更新后的余額發布到我的數據庫時,困難就來了。我嘗試發布add狀態,但毫不奇怪,只是將余額更新為用戶輸入的金額。calculateUpdatedBalance()那么如何訪問我的函數生成的圖形呢?我考慮過在函數中嘗試setState(),但這會產生“狀態更新太多”錯誤。有人對如何獲取更新后的數字并將其發布到我的數據庫有任何建議嗎?
從函數中獲取圖形,并在用戶輸入輸入后將其設置為狀態
慕后森
2023-08-05 19:24:06