功能組件到Class組件

Question

所以我意識到，現在當我們創建一個 React 應用程序時，它默認是功能性的。 所以我想知道是否有任何方法可以將其更改為類。

Answer 1

您可以像這樣將現有功能組件更改為基於 class 的組件

export default class App extends React.Component {
  render() {
    return <h1>Hello</h1>;
  }
}

我建議您通過 React 文檔聯系 go，該文檔通過工作練習很好地解釋了所有內容。

檢查它 - React 文檔

Answer 2

如果您的App.js代碼如下所示：

import React from "react";

export default function App() {
  return (
    <div className="App">
      <h1>REACT APP</h1>
    </div>
  );
}

您可以通過導入Component和一些重構將它變成一個基於 class 的組件，如下所示：

import React, { Component } from "react";

export default class App extends Component {
  render() {
    return (
      <div className="App">
        <h1>REACT APP</h1>
      </div>
    );
  }
}

1. class App將擴展Componment
2. 您的 JSX 將在您的 class 的render() function 中返回