post数据之后的RangeSlider ReactJS始终检索iniatiize值

import React, { Component } from 'react';

class RangeSlider extends Component {
  constructor(props) {
    super(props);
    this.state = {
      value: 0
    };
  }

  componentDidMount() {
    // 假设这里是从POST数据中获取初始值
    const initialValue = this.props.initialValue;
    this.setState({ value: initialValue });
  }

  handleChange = (event) => {
    this.setState({ value: event.target.value });
  };

  render() {
    return (
      <input
        type="range"
        min="0"
        max="100"
        value={this.state.value}
        onChange={this.handleChange}
      />
    );
  }
}

export default RangeSlider;

import React, { useState, useEffect } from 'react';

const RangeSlider = ({ initialValue }) => {
  const [value, setValue] = useState(initialValue);

  useEffect(() => {
    // 假设这里是从POST数据中获取初始值
    setValue(initialValue);
  }, [initialValue]);

  const handleChange = (event) => {
    setValue(event.target.value);
  };

  return (
    <input
      type="range"
      min="0"
      max="100"
      value={value}
      onChange={handleChange}
    />
  );
};

export default RangeSlider;