通过映射到一个子html元素来呈现响应数据...使用React和更新状态
通过映射到一个子HTML元素来呈现响应数据是React中的一种常见操作，可以使用React的状态管理机制来实现。当响应数据更新时，React会自动重新渲染相关的子HTML元素，从而实现数据的动态呈现。
具体步骤如下：
- 首先，在React组件中定义一个状态变量来存储响应数据，可以使用useState钩子函数来实现。例如，可以定义一个名为data的状态变量：const [data, setData] = useState(null)。
- 在组件的生命周期方法中，例如componentDidMount或useEffect钩子函数中，发送异步请求获取响应数据。可以使用fetch、axios等库进行网络请求。
- 在异步请求的回调函数中，将获取到的响应数据更新到状态变量中，可以使用setData函数进行更新：setData(response.data)。
- 在组件的render方法中，使用map函数遍历响应数据，并返回需要呈现的子HTML元素。例如，可以使用数组的map方法将响应数据映射为一组子元素：data.map((item, index) => <div key={index}>{item}</div>)。
- 在render方法中，将映射得到的子元素放置在适当的位置，使其与其他组件或HTML元素一起呈现。
通过上述步骤，可以使用React和更新状态来实现将响应数据映射到子HTML元素并进行呈现。这种方式适用于需要根据响应数据动态生成界面的场景，例如展示列表、表格等数据驱动的页面。在React开发中，可以使用腾讯云的Serverless Cloud Function（SCF）等相关产品来进行服务器端的数据处理和调用，以及腾讯云的COS对象存储、腾讯云数据库等产品来支持数据存储和管理。
更多关于React和相关技术的信息，可以参考腾讯云产品文档中的相关介绍和示例代码：
- 腾讯云Serverless Cloud Function（SCF）：https://cloud.tencent.com/product/scf
- 腾讯云COS对象存储：https://cloud.tencent.com/product/cos
- 腾讯云数据库：https://cloud.tencent.com/product/cdb
相关·内容
在我的React组件中，它呈现一个子组件。当ChildComponent的对象呈现时，响应实例化。
我的问题是，当我单击父组件中的一个按钮时，如何才能强制对恢复剂(一个对象)作出反应？我希望ChildComponent被‘重置’，也就是当它被称为构造函数的时候。
导出类ParentComponent扩展React.Component {
private handleButtonClick() {
// re-instantiate ChildComponent
}
public render() {
return (
<Button onClick={handleButto
浏览 3提问于2022-03-30得票数 0
回答已采纳
import React, { useEffect, useState } from "react";
const Test = () => {
useEffect(() => {
let url = "http://127.0.0.1:8000"
fetch(url)
.then(res => res.text())
.then(res => {
document.getElementById("content").innerHTML = r
浏览 2提问于2021-04-14得票数 1
我有一个包含两个子组件(AddPersonForm和PeopleList)的父组件。当我通过AddPersonForm提交一个名称时，我希望它在PeopleList组件中呈现，但它没有。
这是我的AddPersonForm
class AddPersonForm extends React.Component {
state = {
person: ""
}
handleChange = (e) => this.setState({person: e.target.value});
handleSubmit = (e) =
浏览 5提问于2020-07-20得票数 0
回答已采纳
1回答
我正在和Redux / thunk一起做一个React项目，我从react传单中得到了这张地图：
import { MapContainer, Marker, Popup, TileLayer, Circle } from "react-leaflet";
import { useSelector } from "react-redux";
function Maps() {
const user = useSelector((state: any) => state.userReducer.getUserById);
const coo
浏览 1提问于2021-05-28得票数 0
我想将数组A中的数据传输到对象B中，所以我做了类似于array.forEach(e => setB({...B，e}))的事情，但是似乎在遍历后面的元素时，以前的操作已经被“遗忘”了，我应该如何实现我的目标呢？
原型应该如下所示：
import React from "react"
import {Map} from "immutable"
export default function App() {
const [arrayA, setA] = React.useState([1, 2]);
const [objB, setB] =
浏览 1提问于2021-01-14得票数 2
回答已采纳
刚刚开始学习React。我编写了一个简单的web服务器，它从/users端点提供数据。我正在组件的useState钩子中获取数据，但状态对象似乎没有更新。任何能为我指明正确方向以在有序列表中呈现响应对象数据的人都将不胜感激。
import { useState, useEffect } from 'react';
const UserList = () => {
const [users, setUsers] = useState([]);
useEffect(() => {
fetch("http://loca
浏览 20提问于2021-06-09得票数 1
回答已采纳
我有一个表，在每一行我都显示了我从服务器得到的'Monthly paymnent‘。我将我的分派方法粘贴到render函数中，并抛出错误：“对象作为React子级无效(found: object Promise)。如果你打算呈现一个子级集合，请使用数组。”从异步方法呈现响应而不将其存储在状态中的最佳方法是什么
loans.map((loan, ids) => {
return loan.ratesList.map((rateItem, rateIdx) => {
浏览 12提问于2021-06-04得票数 0
在React类中，我有一个函数"sendMessage“：
class MessageForm extends React.Component {
...
sendMessage = async () => {
const { message } = this.state;
if (message) {
this.setState({ loading: true });
if (this.props.isPrivateChannel === false) {
socket.emit("createMess
浏览 3提问于2020-10-01得票数 0
回答已采纳
当我将获取的数据传递给支持时，它会在组件中返回一个额外的proto对象。在将数据传递给支持之前，当我用componentDidMount()记录数据时，它会返回我希望使用的正确的单一对象格式。但是，当我把它作为道具传递下来时，它会返回两个对象。一个带有proto，另一个是正确格式化的对象。
如何将单个对象格式传递给道具？
Api端点
export const fetchWorldData = async () => {
try {
const response = await axios.get(worldData);
return response;
} cat
浏览 1提问于2020-07-14得票数 0
回答已采纳
1回答
我正在尝试创建一个组件，它接受一个子道具，当这个子道具发生变化时，我想要旧的组件，即子道具在屏幕外动画，而新的组件在屏幕上动画。我尝试使用react使用下面的代码来实现这一点，您可以在这里运行它。
我在这里错过了什么？组件不应该在卸载时向左移动，在挂载时从右侧进入吗？
/** @jsx jsx */
import { useState } from "react";
import { useTransition, animated } from "react-spring";
import { jsx } from "@emotion/core"
浏览 3提问于2022-09-02得票数 0
1回答
我有React函数组件Input --它是一个简单的input字段，只需要一个名为epoch的prop，以毫秒为单位表示epoch的值。在组件内部，我使用moment js来格式化这次是HH:mm (hour:min)格式，我还使用Input组件中的useState设置input值，同时用户更新我需要用复杂算法检查的输入，并且需要附加+/-和数字。
Input.jsx
import React, {useState, } from 'react'
import moment from 'moment'
function Input({epoch}){
co
浏览 2提问于2020-01-14得票数 1
我的父组件，基本上是一个表单，有一个子组件，一个带有加载程序的覆盖，它只需要根据父级的状态来显示。
import React from 'react';
import Overlay from './overlay';
export default class RegisterForm extends React.Component {
constructor {
this.state = {
loading: false
};
}
handleSubmit(){
this.state.loading = tru
浏览 6提问于2016-09-26得票数 2
回答已采纳
1回答
两次调用React组件
、、、
Portal组件被调用了两次。
为什么会这样？
我怎么才能防止这种情况？
index.js
const App = () => {
const theme = lightTheme;
return (
<Provider store={store}>
<StyleSheetManager>
<ThemeProvider theme={theme}>
<BrowserRouter>
<Portal />
</Bro
浏览 3提问于2021-05-18得票数 1
回答已采纳
1回答
我有一个Rest API，为了获得最终数据AKA:ENDDATA，我需要发送一些请求(取决于深度)。因此，当发送第一个请求时，返回响应的主体中将包含nextUri等…
基本上，我需要根据nextUri执行一系列Rest调用，直到到达end ENDDATA为止。
有没有更好的方式来使用React & Redux\redux-thunk来做到这一点。
export const find = () => dispatch => {
dispatch({ type: FIND_CUSTOMER_START });
axios({
method: 'post'
浏览 10提问于2020-03-10得票数 0
问题是：
如何获得引用(作为ReactElement而不是DOM)，在一个节点中，带有螺旋桨引用.
示例，在下面
将类MyTable呈现为：
<table ref="myTable">
{this.state.list.map(name=>
<AddVarTableRow key={name} myName={name}/>
)}
</table>
在componentDidUpdate，想要这样做：
React.Children.forEach(this.refs.tbody.props.ch
浏览 0提问于2016-03-11得票数 0
1回答
在下面的程序中，当我单击任何按钮时，另一个按钮也会重新呈现，即使我已经使用了React.memo()。此外，只有其他按钮得到重新呈现，而不是其他计数。为什么？我有这样一个父组件：
import React, { useState } from 'react'
import Count from './Count'
import Button from './Button'
import Title from './Title'
function ParentComponent() {
const [age, setAge
浏览 2提问于2021-01-25得票数 1
我想在React中使用分页插件。jQuery中的原始用法：
$('#demo').pagination({
dataSource: [1, 2, 3, 4, 5, 6, 7, 8],
pageSize: 3,
callback: function (data, pagination) {
// template method of yourself
var html = template(data);
$("#dataContainer").html(html);
}
});
我想用
浏览 2提问于2016-10-03得票数 0
回答已采纳
2回答
更新动态创建的组件
、、、
情况
我有一个父组件，它呈现一些子组件。子组件应显示从父组件传递的信息。
上下文
玩多人游戏的战舰游戏：
父组件包含多达10x30个按钮(子组件)的10x10字段。如果按下按钮，就会发出带有按钮位置的信号到api。api决定按下的按钮是否需要改变它的颜色。
问题
通过更新父组件的状态，如果子组件是动态创建的，子组件道具将不会被更新。
解决尝试
不要动态地呈现Childs：
在我的情况下不可能
使用剩馀
我认为子组件是转储/表示组件，因为它只显示信息。在我的例子中也有100到300个子组件。
参考文献
有100到300个子组件.
问题
我该怎么办？有没有一种不是反模式的解决方案？
当前代码
浏览 0提问于2018-04-16得票数 1
回答已采纳
当我点击展开图标时，我在我的列表中面临着不必要的重新渲染。目前，我可以在Profiler中看到整个列表被重新呈现，当我试图将列表包装在React备忘录中时，它没有解决这个问题。有什么我可以做的，以防止重新呈现整个列表？
我们的目标是使用navigation变量构建一个模块化的侧边菜单。
const navigation = [
{ id: "Überschrift", type: "header" },
{ id: "Test", icon: <StarBorder />, type: &#
浏览 0提问于2020-10-29得票数 0
我是新来的。我在看他们的医生了解反应是如何运作的。因此，有人提到，当state/props/setState()更改/调用时，重新响应整个组件。
此外，我还看到react元素是不可变的，只有在发生更改时才会呈现它们。因此，当react试图呈现组件时，它实际上遍历所有元素，检查差异，并且只呈现数据被更改的元素。它不会简单地重新呈现整个组件。
我说得对吗？还是我的理解错了？
浏览 8提问于2020-10-23得票数 3
回答已采纳
我正在编写一个react原生应用程序，并希望有一个js文件来监听服务器，从该服务器获取数据，并将更改部署到redux存储，该redux存储根据新数据更新我的react组件。我很好奇，哪里是实例化这个监听服务器的对象的合适位置？目前，我正在应用程序的顶层组件中实例化它，如下所示……
在ControlBoard中，我初始化对象...
然后DataModel响应服务器并通过redux更新应用状态。
我在使用这种方法时遇到了问题(例如，有时ControlBoard会被多次构造)。有没有更好的方法来实现这一点？
浏览 9提问于2019-10-20得票数 0
表示，我不应该将一个React组件保持在它的父状态。相反，每次运行时，我都应该在render方法中重新创建子程序。
什么不应该进入州？
响应组件：基于底层支持和状态在render()中构建它们。
现在我的问题是:我怎么能做到这一点？有可能吗？如果我从头开始重新创建一个子组件，该状态不是已经丢失了吗？
我认为这个场景能够工作的唯一方法是，只有一个状态对象，并且它属于根组件。其余组件将只具有props，每当它们想要更新它们的某些状态时，它们都需要调用某些父级处理程序直到根组件，因为它是唯一具有状态对象的组件！更新后，根将将子组件的状态返回为props。我觉得这根本不实用！
更新
下面是我发
浏览 5提问于2016-05-21得票数 1
回答已采纳
1回答
首先，我正在做一个问卷调查，决定开始学习React.js。问卷的每一步都包括一个问题和一个“是/否”单选按钮组，以及导航按钮。这是。问题组件非常直接，我正在传递formData并将数据函数保存到父组件中。
和问题组件的代码。
var Question = React.createClass({
getInitialState: function() {
return {
}
},
createMarkup: function(html) {
return {
__html: html
浏览 3提问于2015-05-16得票数 1
回答已采纳
在React中，我有一个功能组件，在单击子组件按钮("GenerateButton")时，应该启动另一个子组件("UsersView")的呈现，然后显示从REST API中拉出的用户列表。 在调试时，我注意到即使"dataShouldLoad“状态切换为true，它甚至不会尝试加载"UsersView”组件中的代码，尽管"dataShouldLoad“被传递并用作属性。为什么会这样呢？我该怎么办？ 以下是我的简化代码片段： import React, {useState} from 'react';
import Gen
浏览 11提问于2020-07-09得票数 0
回答已采纳
我有一个子组件，它使用父组件的值作为子组件中的状态，该值是使用API获取的，因此，第一次该值为空，在获取响应后，值将被更新，但在第一次呈现后，当值为空时，应用程序会崩溃，一个白色屏幕会被卡住，不会重新呈现。
我的父组件
export default function Profile() {
const [user, setUser] = useState({});
const PF = process.env.REACT_APP_PUBLIC_FOLDER;
const username = useParams().username;
useEffect(() => {
浏览 7提问于2022-07-11得票数 0
2回答
因此，我有一个Notesdata数组，其中包含带有属性title、标签行和描述的对象。Notesdata数组存储在appending中的" data“状态变量中，我将此数据状态变量发送到notes视图组件以填充UI，但是当我在数据状态变量中添加一个新对象，然后将其发送到notesview组件时，我将得到错误"Data.map不是一个函数”。
当我打印"data“状态变量时，我得到一个数组，但是当我检查它的类型时，它显示的是"object"，我很困惑为什么它会这样显示。
在将"data“状态变量传递到notesview之前，我还尝试在”data“状
浏览 8提问于2022-09-07得票数 0
回答已采纳
我从Node发送数据来在数组对象中响应JS。在response中，当我设置响应数据时，我得到了一个错误：“对象作为一个are子对象无效(找到:带有键{eventName、eventDate、商船}的对象)。如果您打算呈现一个子集合，那么使用一个数组代替。”
我检查了一个堆栈溢出帖子。我也以同样的方式设置值，但我得到了错误。
下面是我从Node发送的数据。
[
{
eventName: 'Sankranti',
eventDate: 2021-01-21T00:00:00.000Z,
merchantid: 'tp012345'
}
浏览 1提问于2021-01-19得票数 1
回答已采纳
5回答
我在看
我非常了解安装过程，但我有一天很难理解如何响应更新组件及其子程序。
调节器通过以下方法控制更新过程：
function receiveComponent(component, element) {
let prevElement = component._currentElement;
if (prevElement === element) {
return;
}
component.receiveComponent(element);
}
Component.receiveComponent
receiveComponent(nextElement) {
浏览 14提问于2022-01-07得票数 3
回答已采纳
关于React中的构造函数，我有一个问题
看看上的一个例子
import React from "react";
import ReactDOM from "react-dom";
import "./styles.css";
class SimpleComponent extends React.Component {
constructor(props) {
super(props);
this.state = {
number: props.number,
}
console.log(&#
浏览 0提问于2019-01-30得票数 2
1回答
我正在从react中的firebase获得数据，但由于变量是在内部定义的，所以我无法传递这些数据。以下是我想要做的。
function getCommentNums(item){
const formRef = database.ref(
`/comments/${form_id}/${instanceId}/${item.id}`
);
console.log('formref = ', formRef)
formRef.on('value', async(snap)=>{
const commentsArr = (awa
浏览 1提问于2022-09-25得票数 0
回答已采纳
1回答
因此，这里的主要问题是:我打开了一个websocket，在这里我需要在第一条消息中读取一个sessionId，以便使用它来发送更多的消息。因此，这只需要做一次。
我有一个子组件"processMessage“，如下所示：
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import ChatBot from 'react-simple-chatbot';
export class ProcessMessage extends Co
浏览 3提问于2017-10-03得票数 0
回答已采纳
1回答
因此，我有一些类似于图像编辑器的React和画布，每次拖动滑块之类的时候，画布都会更新。但是，拖拽滑块和与UI的交互通常是非常缓慢的，因为画布更新很重。是否有任何方法在后台更新它，同时保持UI响应？
我尝试使用useTransition，但我猜想它只适用于呈现组件，而不是更新画布，因为它没有帮助。
浏览 6提问于2022-08-29得票数 0
我正在尝试显示来自后端的数据，但我得到了错误:错误:对象作为React子级无效(找到:具有键{id，price，descr，link，sqf}的对象)。如果您打算呈现一个子级集合，请改用数组。 我一直在寻找解决方案，我遇到了.map，但它不起作用，再次抛出一个错误。 import React, { useState, useEffect } from 'react';
import ArticleService from '../services/articles';
const Dashboard = () => {
const [content
浏览 15提问于2021-01-14得票数 0
回答已采纳
我试图动态地生成reason中的下拉列表，每个新的下拉列表都将引用处于我的状态中的数组中的索引，但是由于某种原因，带有布尔值的setState()将不允许级联。
import React, { useState } from "react";
function App() {
const [dropdownName, setDropdownName] = useState(["All"]);
const [dropdownOpen, setDropdownOpen] = useState([false]);
const addNewDropDow
浏览 11提问于2020-10-24得票数 1
回答已采纳
在React文档中有很多地方，它说React可能会将一批状态更改排入队列，然后再进行一次。
setState()将更改排队到组件状态，并告诉您需要用更新的状态重新呈现该组件及其子组件。这是用于更新用户界面以响应事件处理程序和服务器响应的主要方法。
把setState()看作是一个请求，而不是更新组件的直接命令。为了更好地感知性能，React可能会延迟它，然后一次更新几个组件。React不能保证立即应用状态更改。
setState()并不总是立即更新组件。它可以对更新进行批次或将更新推迟到以后。这使得在调用this.state ()之后立即读取setState()成为一个潜在的陷阱。相反，使
浏览 1提问于2019-03-25得票数 2
回答已采纳
我的组件有一个按钮。通过单击该按钮，将发出一个操作，并进行相应的API调用。API调用的响应存储在redux中。但是，每当对redux存储进行更新时，组件(我正在处理的组件)就会被卸载和重新挂载。因此，当组件重新挂载时，组件的内部状态将被破坏和重新创建。
我的问题是：
当redux存储被更新时，组件是否需要卸载和重新安装？如果是预期的，我应该如何保持组件的内部状态？
AsyncComponent：
export default function asyncComponent(importComponent) {
class AsyncComponent extends React.Comp
浏览 2提问于2019-08-23得票数 3
回答已采纳
假设我们有两个组件，如下所示
class Exa extends React.Component {
render() {
console.log('re-render')
return <div>{this.props.children}</div>
}
}
和
class ExaGroup extends React.Component {
render() {
return (
<div>
<Exa>
<Exa className={t
浏览 0提问于2019-04-05得票数 0
回答已采纳
首先，我编写了一个Python代码，返回用户名的前3个字母(输入每个用户名，以便前三个字母指定其类型)。这是Django(python)代码：
from django.shortcuts import redirect, render
from rest_framework.views import APIView
from rest_framework.response import Response
class usertype(APIView):
def get(self,request,format=None):
try:
user=r
浏览 4提问于2021-05-18得票数 0
回答已采纳
好的，所以我开始把我的头放在ReactJ上，但是一直被一个简单的概念所困扰，那就是一个简单的老jQuery。
当单击事件发生在另一个元素上时，我希望能够添加到屏幕上一个元素的内容中。在之后，我完全理解了他们实现对注释列表的添加的方式，注释列表是正在设置状态的父级的子元素。但是，这肯定不是唯一的办法，因为它感到非常僵硬和不灵活。
下面是我试图解释的一个简单的模型。单击按钮后，我想用id“newComments”向div注入新内容。JSBin：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8
浏览 2提问于2015-05-17得票数 1
回答已采纳
我正在为一个使用ES6 JavaScript构建的开源React/Redux应用程序做出贡献。我是React/Redux的新手，所以我遇到了一些麻烦。
我有一个父类，它呈现两个不同的React组件。第一个组件包含一些关于事件的输入字段(称为NewShift)。第二个组件是呈现这些事件的日历(称为Index)。
一旦用户填写了输入字段并按下了第一个组件中的按钮，我希望能够在第二个组件中重新呈现日历。如果重新呈现函数在日历组件中，我如何从输入字段组件(两个子组件)调用它。
浏览 1提问于2019-03-29得票数 0
2回答
我有一个npm导入的组件(CKEditor)，它只关心挂载时其父组件的状态。也就是说，无论父组件的状态发生什么变化，如果已经挂载，CKEditor都不会反映这些变化。
这对我来说是一个问题，因为当父组件更改其语言属性时，我需要CKEditor根据父组件的状态进行更改。
有没有办法让一个子组件从父组件上卸载并重新挂载？例如，有没有办法根据父组件的"componentWillReceiveProps“卸载并再次挂载子组件？
import React from 'react';
import CKEditor from "react-ckeditor-
浏览 0提问于2018-03-09得票数 9
回答已采纳
有问题时，当指向comp的标题状态为空时，如果我编辑代码并刷新其显示，如果我将状态添加到useEffect "itemCollectionRef，items“是一个inf循环，但是数据是它们的任何人都有更好的想法或方法从消防局获取数据以供显示。
import React, { useState, useEffect } from "react";
import { Grid, Box, Button, Space } from "@mantine/core";
import { ItemBadge } from "../../components
浏览 2提问于2022-07-14得票数 0
回答已采纳
如何将typescript函数导入html文件并调用它。老实说，我不知道该怎么做。 这是我尝试调用getJSON()的index.html <!DOCTYPE html>
<html lang="en">
<body>
<section id="root"></section>
<script
crossorigin
src="https://unpkg.com/react@16/umd/react.production.min.js
浏览 23提问于2019-10-03得票数 0
1回答
我正在用react编写一个redux应用程序，避免使用react-redux，这在技术上是可行的，如果我们手动处理所有分派的事件。这是示例代码。
The index.html
<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/redux/3.6.0/redux.min.js"></script>
<script src="https://cdnjs.cloudflare.com/aja
浏览 8提问于2020-10-14得票数 1
回答已采纳
1回答
在状态数组中添加对象
、、、
我试图在状态中定义的数组中添加一个对象，该对象(对象)来自一个子数组，然后移动到父级，将其设置为父级状态，并将其交给另一个(该子代码在下面)作为支柱。我看到了一些解决办法，但它们没有起作用。目前的解决方案给了我一个无限的循环，道具项目被一遍又一遍地添加。因此，我的问题是如何在数组中添加一个项，它是在状态中定义的，而我们得到的项是一个支柱。这是我的密码
import React, { Component } from "react";
import "./ShoppingCart.css";
class ShoppingCart extends Compo
浏览 1提问于2022-02-06得票数 0
为什么响应钩子Axios调用两次..。即使是装上子弹的支票？
我已经习惯了this.setState，但是我试着理解为什么它会在我的控制台日志中出现两次。
我的代码：
import React, { useState, useEffect } from "react";
import axios from "axios";
const App = () => {
const [users, setUsers] = useState({ results: [] });
const [isLoading, setIsLoading] = useSta
浏览 1提问于2019-05-29得票数 4
回答已采纳
我正在学习反应，并试图把我的头脑围绕着语法和概念。从“反应”的教程中可以提到：
状态更新可能是异步
为了提高性能，React可以将多个setState()调用批处理到单个更新中。
因为this.props和this.state可能是异步更新的，所以不应该依赖它们的值来计算下一个状态。
我的问题是，如果this.state没有在任何时候都被更新，我们能依靠它来显示正确的信息吗？如果我的理解是正确的，出于性能原因，React将批量更新此状态，但它是否会影响应用程序的准确性？如何反应创建这些批次，以及何时应用？
浏览 0提问于2017-01-23得票数 1
回答已采纳
父类有几个子组件，所有子类都在呈现方法中实例化，因此，对父状态的任何更改都会导致所有子实例重新实例化，每次调用react创建子实例的新实例，在那里通过子实例的松散状态，以便重用我尝试使用parent.refs.childRef检索子实例的子实例，但这给我带来了错误。
未明错误:对象作为一个React子对象无效。
，这是我的密码
placeHolderComponent(){
let component;
let palceHolderValue=this.state.uiState.placeHolder;
let classInstan
浏览 4提问于2016-12-02得票数 2
1回答
我正在转换一个用Wordpress构建的大型网站来做出反应，下面是我的问题：
在ComponentDidMount上，我将调用一个API，并获得一个长长的ID列表，这些ID将添加到我的状态中。ID对应于我需要动态呈现的人。
现在我的状态设置为一个ID数组，我将映射它来返回一些JSX，
即arrayIDs.map(id => {返回img src={异步值=== img URL从承诺} />返回)
问题是，对于每个ID，我将需要进行一个单独的API调用，该调用从我的承诺中返回一个异步值，如上文所示。我还没有找到在React中呈现异步值的方法。我不能使用state，
浏览 2提问于2017-10-24得票数 0
1回答
我正在尝试渲染一个有两个子组件的父组件。子对象的渲染将切换，所以一次只渲染第一个子对象，另一次渲染最后一个子对象，最后切换回第一个子对象(然后它应该包含前面显示的所有值)。我以为这会很简单，但事实证明并非如此。
现在来看问题:每当调用方法switchContainer时，它都会切换容器并呈现另一个容器。然而，所有的成员变量、属性和状态都丢失了，它基本上从头开始重新实例化了子组件。
有没有办法“按原样”保存子组件，并且一旦重新呈现，它将再次保存所有成员变量、属性和状态？
我知道你可以像这样向元素发送道具和状态：
<Child props={<data>} states={<
浏览 10提问于2018-07-25得票数 2
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
