如果我的表格單元格中沒有列印動物，我該怎么做才能獲得破折號 (-)。使用我嘗試過的方法，如果我有以下情況，我的單元格仍然是空的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 >
)
}
....
}
uj5u.com熱心網友回復：
使用行內三元條件邏輯
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> }
)
}
....
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/497571.html
標籤：javascript html 反应