Error no detectado: Infracción invariable: findComponentRoot (..., ... $ 110): no se puede encontrar el elemento. Esto probablemente significa que el DOM fue mutado inesperadamente
¿Qué estoy haciendo mal con los ciclos anidados en React? He buscado información en Google y no he encontrado nada adecuado. ¿Me pueden ayudar a encontrar lo que entiendo mal?
Como se puede ver en la figura, tengo datos en una variable. Y funciona bien. Pero cuando agrego un valor no de esto<tr>
, aparece el error!
var TableBalls80 = React.createClass({
render:function(){
var rows = this.props.rows;
var columnId = 0, trKey = 0, divKey = 0, td1stKey = 0;
var td2ndKey = 100;
return(
<table className='table table-bordered bg-success'>
<thead>
<tr className='danger'>
{rows[0].row.map(function (element){
columnId++;
return (
<th colSpan="2" key={columnId}>{columnId}</th>);
})}
</tr>
</thead>
<tbody>
{rows.map(function (rowElement){
return (<tr key={trKey++}>
{rowElement.row.map(function(ball){
console.log('trKey:'+trKey+' td1stKey'+td1stKey+' ball.value:'+ball.value+' td2ndKey:'+td2ndKey+' ball.count:'+ball.count);
return(<div key={divKey++}>
<td className='info' key={td1stKey++}>{ball.value}</td><td key={td2ndKey++}>{ball.count}</td>
</div>);
})}
</tr>);
})}
</tbody>
</table>);
}
});
Error (depende de qué elemento se agrega desde otro<tr>
):
Error no detectado: Infracción invariable: findComponentRoot (..., .0.1.1.0.2.0.0.1. $ 0. $ 9. $ 109):> No se puede encontrar el elemento. Esto probablemente significa que el DOM fue mutado inesperadamente (por ejemplo, por el> navegador), generalmente debido a que olvidó a cuando se usan tablas, n ...... `.