Reactjs 如何在功能组件中使用函数

我有一个使用基于类的组件的代码：

export default class Sidebar extends Component {
  renderHello() {
    return <h1>Hello</h1>
  }

  render() {
    return (
      <Wrapper>
        {this.renderHello()}
      </Wrapper>
    );
  }
}

function Sidebar() {

  {/* Should I write the function here?? */}

  return (
    <div>
      {/* How to call a function here?? */}
    </div>
  )
}

---

这就是你能做到的

function Sidebar() {


  const renderHello = () => <h1>Hello</h1>

  return (
    <div>
      {renderHello()}
    </div>
  )
}

函数边栏（）{
const renderHello=（）=>您好
返回(
{renderHello（）}
)
}

用法相同，只是没有

这个

，即

函数renderHello（）{…

和

{renderHello（）}

。

renderHello

的

const

和

function

之间有什么区别？我们在这里所做的是使用一个箭头函数将其分配给renderHello。所以在某种意义上renderHello仍然是一个函数，但是编写

const renderHello=（）=>{}之间有什么区别

和

函数renderHello（）{}

？这只是语法上的差异吗？好的。谢谢。感谢您的帮助！！