Tengo este fragmento de código que llama a una de dos funciones para devolver algo de JSX que luego se agrega a una matriz para que se muestre más adelante en la función. El problema que tengo es que en cada ciclo a través de la matriz de entradas en las subsecciones no se sobrescribe y, como tal, las entradas para otras subsecciones se agregan a la matriz final varias veces.
Cualquier consejo o dirección sobre dónde buscar para resolver este problema sería muy apreciado.
// Subsections for (let i = 0; i < pageComponent['subsections'].length; i++) { let subsectionComponent = pageComponent['subsections'][i]; let inputs = []; // Inputs for (let k = 0; k < subsectionComponent['questions'].length; k++) { let questionComponent = subsectionComponent['questions'][k] if (questionComponent['type'] === 'TextArea') { this[inputs].push(this.addTextArea(questionComponent)); } else { this[inputs].push(this.addInput(questionComponent)); } } subsectionInputs.push(<div key={i+"_subgroup_div"} className="form-group row"> <h3 style={{margin: 15}}>{subsectionComponent[0]}</h3> {this[inputs]} </div>); }Está haciendo referencia a this[inputs] cuando creo que solo tiene la intención de hacer referencia a las inputs directamente.
if (questionComponent['type'] === 'TextArea') { inputs.push(this.addTextArea(questionComponent)); } else { inputs.push(this.addInput(questionComponent)); }Y aquí:
subsectionInputs.push(<div key={i+"_subgroup_div"} className="form-group row"> <h3 style={{margin: 15}}>{subsectionComponent[0]}</h3> {inputs} </div>);