Parece que sería fácil, pero no sé.
{Info.seedShapeDisplayText} -> one two three four ..
one onClick <div> Hi Number Minsu, Bar : 1 </div>
two onClick <div> Hi Number Jenny, Bar : 3 </div>
En resumen, cuando se hace clic en 'un texto de etiqueta li', el div generará el valor '{NumberStatus}' correspondiente a 'un texto' y {functionInfolabels} valor correspondiente.
Haga clic en el primer botón Quiero imprimir los primeros valores de matriz Minsu y 1. ¿Cómo le gustaría escribir código?
let functionInfolabels = ProductDetail && ProductDetail.chart?.functionalsInfo?.[0].materialsInfo?.[0].ingredientsInfo?.map(array => array.ingredientDisplayText); console.log(functionInfolabels) // Array( 1,3,124 ..) let NumberStatus = ProductDetail && ProductDetail.chart?.functionalsInfo?.[0].materialsInfo?.[0].ingredientsInfo?.map(array => array.chartStatus) console.log(NumberStatus) // Array ( Minsu, Jenny, Youngmin, ...) return ( {ProductDetail && ProductDetail.chart?.functionalsInfo?.length ? ProductDetail.chart?.functionalsInfo.map(Info => ( <li key={Info.id}>{Info.seedShapeDisplayText}</li> )) : <li>There is not</li>} // {Info.seedShapeDisplayText} -> one two three four .. // one onClick <div> Hi Number Minsu, Bar : 1 </div> // two onClick <div> Hi Number Jenny, Bar : 3 </div> .... <div> Hi Number {NumberStatus} // Minsu, Jenny, Youngmin, Jiho ... <Bar labels={functionInfolabels} // 1, 3, 124 .... /> </div> )¿No podría simplemente agregar onClick a su elemento <li> ?
<li key={Info.id} onClick={() => setStateValue(Info.id)}> ...