• react.js:20157 Uncaught Invariant Violation: _registerComponent(...): Target container is not a DOM


    1、错误描述

    react.js:20157 Uncaught Invariant Violation: _registerComponent(...): Target container is not a DOM element.

    2、错误原因

    <script>
    var ea = React.createClass({
     render: function() {
    		          var elapsed = Math.round(this.props.elapsed  / 100);
    		          var seconds = elapsed / 10 + (elapsed % 10 ? '' : '.0' );
    		          var message = '开始计时:' + seconds + ' 秒';
    		
    		          return React.DOM.p(null, message);
    		        }
    		    });
    		
    		    var eaf = React.createFactory(ea);
    			var timer = document.getElementById('timer');
    		    var startTime = new Date().getTime();
    		      setInterval(function() {
    		        ReactDOM.render(
    		          eaf({elapsed: new Date().getTime() - startTime}),timer
    		        );
    		    }, 1000);
    		</script>
         在定时器中需要获取div容器对象,这里利用变量timer来实现;但是会出现这个错误

    3、解决办法

    <script>
    			var ea = React.createClass({
    		        render: function() {
    		          var elapsed = Math.round(this.props.elapsed  / 100);
    		          var seconds = elapsed / 10 + (elapsed % 10 ? '' : '.0' );
    		          var message = '开始计时:' + seconds + ' 秒';
    		
    		          return React.DOM.p(null, message);
    		        }
    		    });
    		
    		    var eaf = React.createFactory(ea);
    		    var startTime = new Date().getTime();
    		      setInterval(function() {
    		        ReactDOM.render(
    		          eaf({elapsed: new Date().getTime() - startTime}),document.getElementById('timer')
    		        );
    		    }, 1000);
    		</script>
            不利于中间变量timer,直接利用JS获取对象的方法
     
  • 相关阅读:
    Ubuntu20安装docker
    ubuntu 下mysql 大小写问题
    Tensorflow-常见报错解决方案
    迁移学习(Transfer Learning)
    c#的托管代码和非托管代码的理解
    .net面试题升级版
    ADO.NET知识点
    支持“WeShopDb”上下文的模型已在数据库创建后发生更改。请考虑使用 Code First 迁移更新数据库
    .net 面试题
    6、zookeeper应用场景-分布式唯一ID
  • 原文地址:https://www.cnblogs.com/hzcya1995/p/13314063.html
Copyright © 2020-2023  润新知