¿Cómo puedo hacer para obtener un guión (-) si no tengo animales impresos en la celda de mi tabla? Con lo que he probado, mi celda queda vacía si tengo animals:[] :
export default function Animals() { const data = useMemo(() => [ { Header: 'Animals', accessor: (row) => row.animals, Cell: (props) => ( <div> {props.value !== [] ? props.value.map(({ name }) => name).join(", ") : ''} {props.value.length > 0 && <InfoIcon position="right" message={props.value !== [] ? props.value.map((o) => ( <span key={o.name}> <b>{o.name}</b> <p>Type: {o.type}</p> <p>Price: {o.price}</p> </span> )) : '' } />} </div > ) } .... }usar lógica de condición ternaria en línea
export default function Animals() { const data = useMemo(() => [ { Header: 'Animals', accessor: (row) => row.animals, Cell: (props) => ( { props.value !== [] && props.value.length > 0 ? <div> {props.value !== [] ? props.value.map(({ name }) => name).join(", ") : ''} {props.value.length > 0 && <InfoIcon position="right" message={props.value !== [] ? props.value.map((o) => ( <span key={o.name}> <b>{o.name}</b> <p>Type: {o.type}</p> <p>Price: {o.price}</p> </span> )) : '' } />} </div > : <div>-</div> } ) } .... }