const Label = children => (
<div className="label">{children}</div>
);
<Label>some text</Label>
这就产生了一个错误：
对象作为React子对象无效(找到:带有键{子类}的对象)。如果您打算呈现一个子集合，请使用数组代替。
正确的方法是什么？
浏览 5提问于2017-10-29得票数 6
回答已采纳
父类有几个子组件，所有子类都在呈现方法中实例化，因此，对父状态的任何更改都会导致所有子实例重新实例化，每次调用react创建子实例的新实例，在那里通过子实例的松散状态，以便重用我尝试使用parent.refs.childRef检索子实例的子实例，但这给我带来了错误。
未明错误:对象作为一个React子对象无效。
，这是我的密码
placeHolderComponent(){
let component;
let palceHolderValue=this.state.uiState.placeHolder;
let classInstan
浏览 4提问于2016-12-02得票数 2
我是新的反应，并试图建立一个表单，在点击提交时，应该设置等于用户条目的组件状态，以便我可以存储它并引用到其他地方。这是因为控制台在提交后记录正确的字符串。然而，当我试图在屏幕上显示这个状态时，我遇到了麻烦。
我尝试将状态作为支持传递给子组件，并将其呈现在那里，但遇到了相同的错误。
import React from 'react';
var hasSetMainGoal = false;
class LearningGoals extends React.Component {
constructor(props) {
super(props);
浏览 1提问于2019-08-06得票数 1
回答已采纳
我正在使用firebase开发一个react应用程序。当我试图从数据库中检索我的消息时，我得到了以下错误 对象作为React子级无效，如果要呈现子级集合，请改用数组。 我的代码 const [channels, setChannels] = useState([]);
useEffect(() => {
db.collection('channels').onSnapshot((snapshot) =>
setChannels(
snapshot.docs.map((doc) => ({
浏览 14提问于2021-02-08得票数 1
1回答
有人能帮我理解一下登录后的情况吗?在用户页面中，我会尝试刷新页面，这样会引发错误吗？
错误是：
错误:对象作为React子对象无效(找到:键{}的对象)。如果您打算呈现一个子集合，请使用数组代替.。
这是我的代码
浏览 0提问于2021-12-13得票数 0
父组件--
import React from "react";
import {View,SafeAreaView,Text,StyleSheet} from 'react-native';
import TestComponent from "./Components/TestComponent";
const Test = () => {
return (
<View>
<Text>Here are some boxes of different
浏览 2提问于2022-03-16得票数 0
我是新的反应(和一般的网页开发)试图建立一个简单的应用程序。我相信这是显而易见的，但一天都找不到解决办法。使用下面的代码，我得到了一个错误: Uncaught不变冲突:对象作为React子对象无效(找到:带有键{message}的对象)。如果您打算呈现一个子集合，请使用数组代替。
我也尝试了几种方法来纠正每一个其他的帖子，但从未成功(并得到不同的错误)，我觉得我错过了这里，非常简单的东西。有人能看看我的代码告诉我出了什么问题吗？
父组件(传递此组件从服务器获取的消息id的另一个组件的子组件)：
import React from 'react';
import Singleme
浏览 3提问于2019-10-29得票数 0
React能够使用JSX打印任何原始值和react元素，但是如果它在JSX中遇到任何对象，那么它会抛出一个错误，因为“对象作为react子级无效”。
请帮助我理解这一点，并了解其背后的原因。
浏览 1提问于2021-02-08得票数 2
5回答
下面是我的代码，如果我用字符串初始化测试的话，它工作得很好，但是如果我将它更改为new Date()，则会导致抛出错误。让我知道我做错了什么，因为我刚刚开始反应。
码-
import React from 'react';
import ReactDOM from 'react-dom';
import registerServiceWorker from './registerServiceWorker';
class App extends React.Component {
render() {
浏览 6提问于2017-07-20得票数 5
回答已采纳
var PersistanceLayout = React.createClass({
render : function(){
var jsondata = {// nested json data};
return (<div><table border="true">
<TableRow fullData={jsondata}/>
</table></div>);
}
});
var TableRow = React.createClass({
rend
浏览 2提问于2016-11-29得票数 0
2回答
你能告诉我为什么我会犯这个错误吗？
对象作为React子对象无效(找到:键为{seo_val、text_val}的对象)。如果您打算呈现一个子集合，请使用数组代替。
我正在尝试点击http请求并尝试下拉。
import React from "react";
class DropDown extends React.Component {
constructor(props) {
super(props);
console.log(this.props);
}
render() {
const makeDropDown = ()
浏览 0提问于2018-02-28得票数 3
回答已采纳
整个错误：
不变量冲突:对象作为React子对象无效(找到:带有键{$$typeof、type、key、ref、props、_owner、_store}的对象)。如果您打算呈现一个子集合，则使用一个数组，或者使用createF.‘包装对象。
我找不到这个错误的确切位置，它只是在react dom中产生了一个错误，那么我如何调试和发现这个错误呢？
浏览 2提问于2017-09-12得票数 1
我需要基于一个条件呈现<tr> start并将其关闭： {grid.map((item, index) => {
return <React.Fragment key={index}>
{item.x === 0 ? <tr/> : ""}
<td id={`td_${item.x}_${item.y}`}>
{item.name}
</td>
</React.Fragment>
})} 上面的代码渲染了<
浏览 25提问于2020-07-28得票数 0
谢谢你阅读我的问题。我是一个新的ReactJS。我在使用React.createElement创建组件时遇到了问题。我不知道在使用React.createElement时是否设置了一个以上属性，如下所示：
render()
{
return React.createElement('input',
{onChange: () => this.handleChange},
{value: () => this.state.value}
);
}
React给出一个错误：
对象作为React子对象无效。
在以这种方式编
浏览 2提问于2019-10-08得票数 0
回答已采纳
1回答
我在试着建立一个天气应用程序。我有一个搜索栏组件，它通过api获取数据，并设置天气道具的状态(最初为null)：
getInitialState: function() {
return {text: '', weather: null};
},
handleClick: function() {
WeatherApi.get('q=' + this.state.text).then(function(data) {
this.setState({weather: data})
}.bind(this));
}
浏览 2提问于2016-07-19得票数 0
回答已采纳
如何在其子组件的条件下渲染父组件？如果任何孩子是无效的，我想禁用父母中的按钮。但是验证是在子组件内部进行的。
class Parent extends React.Component {
constructor(props){
super(props);
this.state = {data: [
{type: "text", value: ""},
{type: "email", value: "not valid email"}
]};
isAnyChildInvali
浏览 13提问于2020-05-25得票数 0
我只是在呈现数据并在divs之间显示，但是我得到了错误
对象作为React子对象无效(找到:00 09 1998 00:00:00 GMT+0530 (印度标准时间))。如果您打算呈现一个子集合，请使用数组代替。
<Fragment key={String(index) + String(i)}>
<div>{displaytext}</div>
<div>{value}</div>
</Fragment&
浏览 3提问于2018-12-10得票数 8
回答已采纳
1回答
我为Reactjs中的文件输入编写了一个自定义验证，它检查空文件输入字段的有效性，并显示消息“请附加一个文件”。在试图附加文件时，我会得到以下错误：
invariant.js:44未明错误:对象作为React子对象无效(找到:对象文件)。如果您打算呈现一个子集合，则使用数组代替，或者使用createFragment( object )将对象从React one中包装。
拜托，有什么问题吗？我研究过这件事，但都没有用。拜托，应该有人来帮我。
浏览 0提问于2018-02-19得票数 0
请告诉我为什么我会从这个应用程序中得到这个错误：
index.js：
const API='http://my-domain.com/api/?format=json'
class App extends React.Component{
constructor(props){
super(props);
this.state={
data: [],
isLoading: false,
error: null,
};
}
componentDidMount(){
this.setState({isLoading: true});
浏览 90提问于2018-07-18得票数 0
回答已采纳
1回答
我正在尝试呈现一个组件，但该值位于一个jQuery函数中，该函数检查输入字段中的更改。
控制台返回此错误：
对象作为React子对象无效(找到:对象HTMLDocument)。如果您打算呈现一个子集合，则使用数组代替，或者使用createFragment( object )从React插件包装对象。检查Result的呈现方法
守则：
import React, { Component } from 'react';
import Result from './Result';
import * as $ from 'jquery';
im
浏览 3提问于2017-07-13得票数 0
1回答
我正在尝试在我的页面上有条件地提供很少的消息。下面是我实际场景的简化代码。
<div>
{
isCondition1 == true ?
'Show issue list'
:
isConditionA == true?
'Show message for condition A'
:
'Show error message'
}
</div>
浏览 3提问于2017-08-22得票数 2
回答已采纳
我是react钩子的新手，我试着将react-datepicker从类转换为带有钩子的函数。问题是当我触发时，onChange将会显示(RangeError:无效的时间值)，但是默认的"selected“开始日期呈现良好。这可以用钩子来完成吗？ import React, { useState, Fragment } from 'react';
import Datepicker from 'react-datepicker';
const Example = () => {
const [startDate, setStartDat
浏览 43提问于2019-06-07得票数 1
回答已采纳
我对这个错误做了大量的研究，但是我发现大多数例子都是类组件的错误，我使用的是函数组件！！这是我正在做的React课程的一个要求，我们正在进行第一个项目，另一个要求是仍然不要使用-create :(
因此，他们给了我们React和Babel脚本，下面是我的HTML脚本：
<script
src="https://unpkg.com/react@16/umd/react.development.js"
crossorigin
></script>
<script
src="https:/
浏览 6提问于2020-04-21得票数 1
回答已采纳
有关next.js索引页中下面的代码
import { Typography } from '@mui/material/Typography';
import { createTheme, ThemeProvider } from '@mui/material/styles';
const theme = createTheme({
typography: {
fontFamily: 'Arial'
},
fontFamily: 'Arial'
});
function index
浏览 10提问于2022-04-19得票数 1
1回答
我是新的反应，天真地想做以下工作，试图呈现一些来自Cloudinary的图像。
(注:我可以记录这些图像，我只是得到试图渲染它们的错误)。
这是一个过于简化的版本，但我估计您会发现我哪里出错了：
import axios from 'axios';
const Album = () => {
const getPhotos = async () => {
const allPhotosWithTag = await axios.get(
process.env.REACT_APP_CLOUDINARY_TAG
);
con
浏览 2提问于2021-02-25得票数 0
回答已采纳
1回答
我试图使用道具作为索引来访问对象键，但它不起作用。错误:对象作为React子对象无效(找到:带有键{id、name、img_url、location}的对象)。如果您打算呈现一个子集合，请使用数组代替。我是新的反应，所以我感谢任何帮助。
我的代码：
class ExpandCard extends React.Component {
render() {
const props = this.props;
const profiles = props.profiles;
return(
<>
浏览 0提问于2019-07-26得票数 0
回答已采纳
在我的部分，我有：
function Message(msg) {
//console.log('msg=', msg);
return (
<div>
{
msg ?
<div>{msg}</div> :
<div>Nothing</div>
浏览 3提问于2017-12-07得票数 0
回答已采纳
1回答
我正在使用带有CoffeeScript的ReactJS (：
实际上，我有一个处理状态的组件A。状态字段被传递给子对象(在该示例中称为myChild )。子进程需要从父进程状态更新一些值。
我怎样才能用ReactJS的方式做到这一点呢？
A = React.createClass
getInitialState:
mystate: {test: 1}
render: ->
myChild {param: @state.mystate}
myChild = React.createClass
render: ->
React.DOM.div
浏览 0提问于2014-04-03得票数 11
回答已采纳
试图从天气API中提取数据并将其显示在React中，这是一场噩梦，但是当我运行代码时，会得到一个错误：
“对象作为React子对象无效(找到:对象承诺)。如果您打算呈现一个子集合，则使用数组代替。”
我的代码如下：
export default function getWeatherFromApiAsync() {
return fetch(
"https://api.openweathermap.org/data/2.5/weather?q=brighton,uk&appid=8b609354454cdb6c5a7092a939861ace&uni
浏览 0提问于2021-11-16得票数 1
回答已采纳
因此，我正在学习本机反应的基础知识，遵循文档，并编写两个组件。
我在我的项目中创建了一个包含greetings.js文件的components文件夹，在这个文件中，我必须遵循以下代码：
import React, { Component } from 'react';
import { AppRegistry, Text, View } from 'react-native';
class Greeting extends Component {
render() {
return (
<Text&
浏览 0提问于2018-03-08得票数 0
我正在使用ReactJS和流星构建一个web应用程序。我正在使用结构化我的应用程序的方法，其中组件被拆分到单独的Meteor包中。
例如。我有一个组件，它呈现一个表格菜单(使用semantic-ui选项卡模块)并初始化选项卡，然后每个选项卡都是它自己的React组件。
我如何能够访问另一个组件中的一个组件中的DOM。
示例：
Component = React.createClass({
componentDidMount() {
$('.menu .item').tab({
onVisible: () => {
/
浏览 0提问于2016-01-02得票数 0
在我的后端(仅用于获取信息的nodejs )中，数据将很好地返回。
但是我必须填充在响应中返回的数据。
以显示用户的名称，而不是他的ID
响应以下列形式返回
当我尝试访问用户名(在本例中为realName)时，在我的react应用程序中，会出现一个问题，如这个问题的标题中所示。
我附上所有的信息，如果有人需要更多的信息，请不要犹豫。
这个钩子
import React, { useEffect, useState } from "react";
import { useSelector, useDispatch } from "react-redux"
浏览 10提问于2022-11-28得票数 -2
嗨，我想动态地构建一个表格UI。
我有这样的headers数组
headers = [
{
text: "id",
value: "id",
},
{
text: "Name",
value: "name",
},
{
text: "Description",
value: "description",
},
{
text: "Created
浏览 6提问于2020-08-24得票数 0
我尝试从端点获取数据，但得到错误:对象作为您打算呈现一个子代集合的React child..If无效，请使用数组代替。 import React, { useState, useEffect } from "react";
import { useHistory } from "react-router-dom";
import axios from "axios";
import PropTypes from "prop-types";
import Movie from "./Movie/Movie";
浏览 14提问于2020-09-02得票数 0
回答已采纳
我编写了一个代码，提供的数据如下
var todos = [
{
task: 'A',
isComplete: false
},
{
task: 'B',
isComplete: true
}
]
并且期望输出类似于ToDoList，但是获取错误对象作为React子对象无效(找到:带有键{task, isComplete}的对象)。如果您打算呈现一个子集合，则使用数组代替，或者使用createFragment(object)从React add-ons包装对象。检查Todolist的呈现方法
浏览 1提问于2016-04-27得票数 1
回答已采纳
如何使用reactJS用循环追加DOM元素。
我用点击的方式
在编译器之后，这些代码仍然会得到以下错误：
Uncaught : Content.render()：必须返回有效的React元素(或null)。您可能已返回未定义的数组或其他无效对象。
var Content = React.createClass({
render: function () {
var dom_content = [];
for (var i = 0; i < 3; i++) {
浏览 1提问于2018-05-24得票数 1
回答已采纳
1回答
我尝试使用Jest和Enezym在React中对AntD模式进行单元测试，它给出了以下错误： ? 还有另一个 ? 这也是:不变冲突:对象作为React子对象无效(found:具有键{destroy，update}的对象)。如果您打算呈现一个子级集合，请改用数组。 这是我创建的模型 import propTypes from 'prop-types';
import { Modal } from 'antd';
const SuccessModal = props => {
const { title, content } = props
浏览 34提问于2019-03-06得票数 2
我不确定我做错了什么，这应该很简单！但标题提到，当我单击单选按钮时，它们要么不被选中，要么在错误的时间被选中。
此处是指向代码的活动版本的链接
这是我的index.js
import React from 'react';
import { render } from 'react-dom';
import Radio from './Radio';
const styles = {
fontFamily: 'sans-serif',
textAlign: 'center',
};
const App
浏览 0提问于2017-07-15得票数 0
回答已采纳
1回答
首先，我对反应完全陌生，所以我不确定我的代码是否已经被编写成了"react“。
到目前为止，我已经创建了几个反应类，它提供了一个引导模式。为了设置初始状态，我在componentsDidMount函数中调用Ajax函数。这很好，直到我尝试将普通HTML插入到模态体中。
服务器请求工作正常，我在我的this.state.data.content中获得了普通的HTML代码，但是如果我试图将它插入模态体中，我会收到以下错误：
错误:不变冲突:对象作为React子对象无效(找到:键{__html}的对象)。如果您打算呈现一个子集合，则使用数组代替，或者使用createFragment( ob
浏览 1提问于2015-12-29得票数 6
回答已采纳
我想创建可重用的路由组件
import React from 'react';
import { Route } from 'react-router-dom';
interface ITProffesion {
proffesion: string;
}
export const ITRoleRouter: React.FC<ITProffesion> = ({ proffesion }) => (
<Route exact path={`/${proffesion}`} key={proffesion}>
&
浏览 0提问于2021-01-28得票数 1
我知道什么是中的引用。我所面临的挑战是我没有找到任何关于innerRef的官方文档。它还在使用吗？
我从那里了解到了innerRef：
<ReferenceBox innerRef={ref}>
<a
href="https://github.com/FezVrasta/react-popper"
target="_blank"
>
react-popper
</a>
</ReferenceBox>
如果有人能告诉我什么是innerRef，那就太好了。谢谢!
浏览 1提问于2018-11-09得票数 10
回答已采纳
我有以下简单代码：
var data = [{ email: "bob@gmail.com" },{ email: "toto@gmail.com" }];
var User = React.createClass({
render: function ()
{
return
(
<li>
{this.props.email}
</li>
);
}});
var UserList = React.createClass({
render: f
浏览 5提问于2017-01-27得票数 4
回答已采纳
1回答
我是ReactJS的新手。我应该希望从其他组件中重新呈现一个组件。例如，我插入并显示了组件。我想在单击insert component的submits按钮后重新渲染显示组件。
显示组件：
import React from 'react';
import Fetch from 'react-fetch';
import styler from 'react-styling'
class Show extends React.Component {
render() {
return (
浏览 2提问于2017-08-04得票数 0
回答已采纳
我试图通过使用state将子组件更改为另一个组件。这正确地注入了新的组件，但是，如果我想动态地更改它的道具，什么都不会改变。componentWillReceiveProps没有触发。
在我的场景中，我将有许多像TestComponent这样的组件(将近20-30个组件)，它们都有不同的HTML布局(它们也有子组件)。我从某些列表中选择一些值，从而在这些组件之间切换。
我认为，最初加载所有这些组件似乎不是一个好主意。另一方面，我还没有发现任何关于在主组件中动态注入组件的信息。
这里是我想要实现的一个非常基本的例子。单击该按钮时，我将TestComponent插入到App中。在此之后，每隔一秒，
浏览 4提问于2017-08-25得票数 1
回答已采纳
嘿，我不能用特别的东西来包装我的线路部件。我使用的是反应性路由器-dom v6，但是我无法完成这个任务。
以下是我的实现：
<Route path="/dashboard" element={AuthGuard(<Dashboard />)} />
特设：
import React from "react";
import { Navigate } from "react-router-dom";
import { firebase } from "../firebase";
const Auth
浏览 2提问于2022-01-08得票数 0
回答已采纳
2回答
我正在构建一个ReactJS应用程序，我需要以这种方式存储数据：
this.state = {
user: {
name: "",
surname: "",
age: "",
...
instruments: [],
}
}
instruments状态需要包含多个对象，并具有属性name和experience。举个例子：
instruments: [
{
name: 'Bass guitar',
浏览 1提问于2016-12-10得票数 4
回答已采纳
1回答
我正在用React构建一个应用程序，到目前为止我很喜欢它。然而，我得到了一个错误，我很难确定我做错了什么。这是我的错误：
未知错误:不变量冲突: ImageList.render()：必须返回有效的ReactComponent。您可能已返回未定义的数组或其他无效对象.。
这是我的密码：
// Box for user images
var ImageBox = React.createClass({
closePopup: function(){
React.unmountComponentAtNode(document.getElementById('imag
浏览 0提问于2015-08-20得票数 1
回答已采纳
我正在尝试理解如何在ReactJS中将更改的状态从子组件传递到其父组件？到目前为止，下面的代码改变了孩子的状态，但没有改变父母的状态，你知道我做错了什么吗？
我正在使用redux从mongodb获取产品阵列。
产品数组示例：
[
{
“_id”: “2331”,
“department”: “Shoes”,
“category”: “Shoes/Women/Pumps”,
“name”: “Calvin Klein”,
“title”: “Evening Platform Pumps”,
浏览 5提问于2018-09-06得票数 0
1回答
在ReactJS中，我正在开发一个类组件，并使用Formik进行验证。我可以做验证，但错误信息显示为正常颜色(黑色)。如何在任何HTML元素(span、div等)中添加此错误消息。 下面是要验证的代码 import React, { Component } from 'react'
import { useFormik } from 'formik';
import { Formik, FormikProps, Form, Field, ErrorMessage } from 'formik';
import * as Yup from
浏览 46提问于2020-06-28得票数 1
回答已采纳
我对打字本还不熟悉。我需要通过单击ref按钮来更新还原器值，将子状态值获取给父节点。
我尝试将一个ref传递给孩子，但是我收到了类似于以下内容的错误：
键入'{ value: string；onChange:调度；ref: MutableRefObject<HTMLInputElement \ undefined>；}‘不能分配到键入'IntrinsicAttributes & Props &{子项目？：ReactNode；}’。
属性'ref‘在'IntrinsicAttributes & Props &{子项目？
浏览 4提问于2020-09-11得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
