MUI滑块与文本框实现价格范围：滑块UI不更新问题求助

问题根源在于状态更新时直接修改了原数组引用，React无法检测到引用类型的变化，导致Slider组件没有触发重新渲染，所以滑块UI不动，但控制台能拿到数值。

修复方案： #

更新状态时必须创建新的数组实例，而不是修改原数组：

1. 修复滑块的状态更新函数：

const handleSliderChange = (event, newValue) => {
  setPriceRange([...newValue]);
};

2. 同时修正文本框的状态更新逻辑，确保同样创建新数组：

const handleInputChange = (index, value) => {
  const newPriceRange = [...priceRange];
  newPriceRange[index] = Number(value);
  // 可额外添加边界校验，比如限制数值在min/max范围内，且左值≤右值
  setPriceRange(newPriceRange);
};

修改后，状态更新会触发组件重新渲染，滑块就能正常跟随状态值移动了。

内容的提问来源于stack exchange，提问作者user10033434