我有一個來自 material-UI 的范圍滑塊。在主頁上，呈現數據表。該表具有以下字段：id, name, current price, new price.每個項目的值current price固定為某個值。該new price項目的值將取決于滑塊的值。當范圍滑塊（假設右側）的一個（表格的特定項目的）句柄更改為某個值時，其更新的值將被添加到，current price并且該總和將是該new price特定項目的值. IEitem's new price = item's current price + item's slider value received.但是我面臨的范圍滑塊的問題是它沒有任何 id 屬性或屬性來匹配其值已更改的處理程序。因此，當任何單個項目的滑塊值發生更改時，它會添加到所有項目current price字段而不是選定的特定字段。現在，我正在使用硬編碼的 id 檢查，例如：if (ele.id === 2) { returnValue.new_price = ele.current_price + value; }但我需要一個通用的解決方案。工作片段鏈接：https://codesandbox.io/s/icy-framework-rxui2?file=/src/App.js:822-908任何解決此問題的幫助表示贊賞。提前致謝。
1 回答
慕萊塢森
TA貢獻1810條經驗 獲得超4個贊
在 App.js 中，為每個提供<RangeSlider />一個 id 道具，您可以從表格行數據中獲得該道具：
<RangeSlider id={data.id} setrange={fetchValue} range={range} />在 RangeSlider.js 中，確保將該 id 發送到props.setrange回調：
props.setrange(e.target.textContent, props.id);
也不要忘記在函數 decleration (App.js) 中獲取 id 參數：
const fetchValue = (value, id) => {
...}添加回答
舉報
0/150
提交
取消