javascript-对象无效,作为React子反应错误？

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了javascript-对象无效,作为React子反应错误？，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含849字，纯文字阅读大概需要2分钟。

内容图文

您能否告诉我为什么会出现此错误：

Objects are not valid as a React child (found: object with keys
{seo_val, text_val}). If you meant to render a collection of children,
use an array instead.

我试图按http请求并尝试使下拉菜单.

import React from "react";

class DropDown extends React.Component {
  constructor(props) {
    super(props);
    console.log(this.props);
  }

  render() {
    const makeDropDown = () => {
      console.log(this.data);
      return this.props.data.map(x => {
        return <option>{x}</option>;
      });
    };
    return (
      <div>
        <div>
          <select>{makeDropDown()}</select>;
        </div>
      </div>
    );
  }
}

export default DropDown;

Sandbox.

解决方法:

完整的错误消息：

Objects are not valid as a React child (found: object with keys
{seo_val, text_val}).

错误非常清楚,您尝试在jsx中渲染包含两个键的对象：

seo_val: "..."
text_val: "..."

这样写(渲染所需的值)：

return <option key={x.seo_val}>{x.text_val}</option>;

Working sandbox.

内容总结

以上是互联网集市为您收集整理的javascript-对象无效,作为React子反应错误？全部内容，希望文章能够帮你解决javascript-对象无效,作为React子反应错误？所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

---