当前位置: 首页 > 知识库问答 >
问题:

ReactJs"不变违反..."典型的反应问题

连正信
2023-03-14

这是一个典型的反应问题,但我不知道如何处理它。我只想动态呈现我的表行,但我得到了错误:“未捕获错误:不变冲突:processUpdates():找不到元素的子元素2。这可能意味着DOM发生了意外的变化(例如,通过浏览器),通常是因为在使用表时忘记了,

,或,或在父级中使用非SVG元素。尝试使用React ID.2.1.0检查元素的子节点。"

我知道react没有找到合适的DOM,但如何处理呢?提前谢谢!

<div className="panel-body" style={panelstyle}>
              <Table striped bordered condensed hover>
                <thread>
                  <th> Currency </th>
                  <th> Amount </th>
                  <th> Issuer </th>
                  <th> Limit </th>
                  <th> Limit Peer </th>
                  <th> No-Ripple </th>
                </thread>
                <tbody>
                  {this.state.ripplelines[this.address] ?

                              this.state.ripplelines[this.address].lines.map(function(line,i) {

                            return      (<tr>
                                          <td> USD </td>
                                          <td> 1500 </td>
                                          <td> raazdazdizrjazirazrkaẑrkazrâkrp </td>
                                          <td> 1000000000 </td>
                                          <td> 0 </td>
                                          <td> True </td>
                                        </tr>)       
                            ;
                        })             
                  : ""}
                </tbody>
              </Table>
            </div>

共有2个答案

燕承安
2023-03-14

对于使用Immutable with React的任何人。js:

我得到了同样的错误,即使正确的

壤驷经国
2023-03-14

这里有一个答案:React js:invalival:processUpdates()在呈现具有不同子行数的表时

只需在渲染前准备好行!

render:
 var rows = [];
      if(this.state.ripplelines[this.address] ) {
        _.each(this.state.ripplelines[this.address].lines, function(line) {
           rows.push(                   <tr>
                                          <td> somestuff!</td>

                                        </tr>)
        }); 
      }
return (
    <Table striped bordered condensed hover>
                    <thead>
                      <th> Currency </th>
                      <th> Amount </th>
                      <th> Issuer </th>
                      <th> Limit </th>
                      <th> Limit Peer </th>
                      <th> No-Ripple </th>
                    </thead>     
                    <tbody>
                      {rows}    
                    </tbody>
              </Table>
)
 类似资料:
  • react_devtools_backend。js:2273不变违规:缩小反应错误#152;参观http://reactjs.org/docs/error-decoder.html?invariant=152 当我在本地运行项目时不会出现此问题,但在AWS服务器上部署代码后,可以在控制台中看到此问题。 请帮助,还有一件事如何在本地调试此问题?

  • 我正在渲染一个挑战列表,它在我的本地有效。但是当我将它部署到Netlify时,我在控制台上得到一些错误。我的代码有什么问题? ** react dom.production.min.js:4408不变违规:缩小的react错误#31;参观https://reactjs.org/docs/error-decoder.html?invariant=31

  • 我有这个组件: 完全错误: 不变量违规:不变量违规:超过最大更新深度。当组件在组件WillUpdate或组件DidUpdate中重复调用setState时,可能会发生这种情况。React限制嵌套更新的数量以防止无限循环。 这是给出错误的函数: 我只需要将的状态设置为,这样我就可以切换组件的可见性。

  • 来自Liskov替代原理-www.blackwasp。co.uk 不符合LSP的一个常见指示是当客户端类检查其依赖项的类型时。这可以通过读取人为描述其类型的对象的属性或通过使用反射来获得类型。通常,根据依赖项的类型,将使用开关语句执行不同的操作。这种额外的复杂性也违反了打开/关闭原则(OCP),因为随着更多子类的引入,客户端类需要修改。 以下技术(使用反射)是否会导致违反LSP? 依赖注入 注:我

  • 我目前正在编写一个discord bot反应角色命令。 一切都很顺利,但我有一个问题。 当我启动机器人并运行创建嵌入的命令时,一切都很好。问题是当我对信息做出反应时,它并没有给我这个角色。这是我的代码:

  • 我得到上述错误,而我试图运行我的应用程序。 编辑:添加代码 应用程序。js 登录。js 我不知道这些文件中的哪一个产生了错误。 为了模拟这些代码,我还在世博会上主持我的代码。木卫一 https://snack.expo.io/@wilson382/我的第一款手机应用