為什么反應渲染接受一個塊而返回不接受？

Question

我正在學習 React JS，並面臨着 JSX 的問題。 我有一個組件：

下面的代碼工作正常：

import React from "react";

function Hello() {
  return(<h1> Hello ! </h1>);
}

export default Hello;

但是，這不起作用：

import React from "react";

function Hello() {
  return(){
  <h1> Hello ! </h1>
  };
}

export default Hello;

當我嘗試使用塊作為回報時，為什么 render(){} 接受塊而 return 不接受？

Answer 1

您正在使用基於功能的組件，您無法在其中定義渲染函數，這僅適用於基於類的組件

class Welcome extends React.Component {
  render() {
    return <h1>Hello World</h1>;
  }
}