首页 > 解决方案 > 将变量内容输出到 React 组件

问题描述

我有这个:

let arr = [
  { name:"string 1"},
];

我用这个找到了价值:

let obj = arr.find(o => o.name === 'string 1');

然后我试图输出obj到我的反应组件。

class Links extends Component {
render() {
    return (
        <React.Fragment>
            <Link to="/" className="navbar-brand">
            { obj } 

            </Link>

它是说Uncaught Error: Objects are not valid as a React child (found: object with keys {name})

我是新来的反应所以不知道如何正确地做到这一点......感谢4的帮助:)

标签: javascriptreactjsjsx

解决方案


这里的问题是,您试图打印一个不允许的对象。

如果您尝试运行此程序:

let arr = [
  { name:"string 1"},
];
let obj = arr.find(o => o.name === 'string 1');
console.log(obj); //{name: "string 1"}

您会发现 obj 是一个具有键值对的对象。所以,你需要做的是替换{obj}{obj.name}


推荐阅读