Reactjs ncaught不变冲突：对象作为子对象无效

我正在尝试在React中创建一个组件。我没有在return部分列出我想要呈现的JSX的所有行，而是将信息存储在一个变量中，然后只调用{variable}。这在所有其他情况下都起到了很好的作用，而不是我现在一直坚持的情况。我已经剥离了所有JSX，留下一个空div作为测试人员，但我仍然得到相同的错误：

未捕获不变冲突：对象作为找到的React子对象无效：具有键{message}的对象。如果要呈现子对象集合，请改用数组

我真的很感激任何帮助！ 提前谢谢

import React from 'react';
import classes from './Inbox.module.css';


const Cancel = (props) =>{
    let message;
    message =(<div></div>);

    return(
        {message}
    );
}

export default Cancel;

---

通过使用返回对象消息的方法，我猜您希望像这样包装{message}这样返回jsx并插入变量消息

希望这有帮助

你的问题就在这里

return(
    {message}
);

{message}是一个对象，您正在尝试渲染该对象

你有两种方法来处理这个问题

使用

---

这不是你的真实代码，是吗？您的意思是返回消息而不是{message}，因为它不是您所说的JSX吗

return (
  <React.Fragment> {message} </React.Fragment>
)

return (
  <> {message} </>
)

return( 
   message      //without curly braces , not good idea because you may have multiple other elements 
)