將 React function 組件轉換為 React Class 組件

Question

我有一個使用 useState 設置 refs 的代碼，但我很想將代碼轉換為 class 組件

  const [imageSliderRef, setImageSliderRef] = useState(null);
  const [textSliderRef, setTextSliderRef] = useState(null);

對於上述內容並將其呈現在 jsx 中

帶有鈎子和 jsx 的代碼

Answer 1

如果你想使用類，你可以使用 React.createRef() 創建 Refs 並通過 ref 屬性將 ref 附加到 React 元素。 Refs 通常在構建組件時分配給實例屬性，以便可以在整個組件中引用它們。

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.myRef = React.createRef();
  }
  render() {
    return <div ref={this.myRef} />;
  }
}