0
178
ViewsNo se puede completar una lista en reactjs desde una matriz
Tengo una app de lista. Quiero que su elemento se complete en MenuItem. Intenté lo siguiente: -
{app.map((item, index)=>{ <MenuItem value={item}>{item}</MenuItem> })}pero estoy recibiendo este error: -
Expected an assignment or function call and instead saw an expression console.log(item) muestra [ "NE", "NO" ]
console.log(app) muestra [ [ "" , "", "" ], [ "NE", "N)" ] ]
2 answers
Answer question0
Debe devolver algo del map . En su caso, debe devolver MenuItem como
Demo en vivo
Below will implicitely return the MenuItem
{ app.map((item, index) => <MenuItem value={item}>{item}</MenuItem>); // without { and } } o puede devolver explícitamente el MenuItem
{ app.map((item, index) => { console.log(item); return <MenuItem value={item}>{item}</MenuItem>; }); } EXPLANATION
Dado que está utilizando map aquí, que debería usarse si queremos mapear sobre la matriz y devolver algo de ella, y map devolverá una matriz de elementos y lo que desea es mapear sobre la matriz de app y devolver elementos MenuItem porque lo que sea que regresará del map eventualmente se convertirá en niños React.
return ( <div> {app.map((item, index) => { ( <MenuItem value={item} key={item}> {item} </MenuItem> ); })} </div> );El fragmento de código anterior se convierte en
return /*#__PURE__*/React.createElement("div", null, app.map((item, index) => { /*#__PURE__*/ React.createElement(MenuItem, { // NOTICE, you are not value: item, // returning any React key: item // Elements from here }, item); })); Entonces, deberías regresar del map
0
2 Problema
-
console.log(item),toconsole.log(item); // coma a punto y coma -
<MenuItem value={item}>{item}</MenuItem >parareturn <MenuItem value={item}>{item}</MenuItem>// necesita regresar