react 组件的写法问题疑问

Question

问题描述

react 组件的写法问题疑问 ?

问题出现的环境背景及自己尝试过哪些方法

无状态组件 是否需要写return ,看到别人代码不带return 可以 ，我不带就报错
https://www.cnblogs.com/SamWe...

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）
export const Home = ()=>{

return (
        <div>
            <h1>企业网站</h1>
            <nav>
                <Link to='/about'>关于我们</Link>
                <Link to='/events'>企业事件</Link>
                <Link to='/products'>公司产品</Link>
                <Link to='/contact'>联系我们</Link>
            </nav>
        </div>
    )

}

==============
别人的写法 （不带return）
export const Home = ()=>{

        <div>
            <h1>企业网站</h1>
            <nav>
                <Link to='/about'>关于我们</Link>
                <Link to='/events'>企业事件</Link>
                <Link to='/products'>公司产品</Link>
                <Link to='/contact'>联系我们</Link>
            </nav>
        </div>

}

你期待的结果是什么？实际看到的错误信息又是什么？

到底带还是不带呢？

Answer 1

你看错了吧？ 人家是用的箭头函数特性 箭头后面后面不是 {} 而是 (),相当于直接return ()了

export const Home = () => (

        <div>
            <h1>企业网站</h1>
            <nav>
                <Link to='/about'>关于我们</Link>
                <Link to='/events'>企业事件</Link>
                <Link to='/products'>公司产品</Link>
                <Link to='/contact'>联系我们</Link>
            </nav>
        </div>
)