我有一個表格，它自己填充它的行和<td>標簽。它做得很好，如下所示：
該表是通過陣列映射生成的。
{objInnerValues[shopIndex].map((thing, outerIndex) => (
// Ternary operator to stop creating rows from element 0
(outerIndex === 0) ? console.log("outerIndex WAS 0") : (outerIndex %2 === 0) ?
Object.values(thing).map((innerThing, innerIndex) => (
<>
{/* Tooltip popup for item blurb */}
<HtmlTooltip title={
//a tooltip component, from MUI. Gets a string to display
}
>
{/* Table rows for each record */}
<TableRow
//style definitions, then an id for the row...
id = {"rowID-" thing[0][0]}
>
{AR_RowRefs.push("rowID-" thing[0][0])}
{/* Indidivual td elements to display each item in a row*/}
<SuperTD NoHoverTD>
{//Items name}
</SuperTD>
<SuperTD NoHoverSmallTxtTD>
{//category the item belongs to}
<Button>
//a visibility button, part of what I'm trying to work on
</Button>
</SuperTD>
<SuperTD NoHoverSmallTxtTD>
{
//Get weight of item from array and format it
}
</SuperTD>
<SuperTD NoHoverSmallTxtTD>
{
//Get price from array and format it
}
</SuperTD>
{/* Checkbox for if item is available */}
<SuperTD>
<input type="checkbox" defaultChecked={innerThing[6]}/>
</SuperTD>
{/* Checkbox for if item is limited */}
<SuperTD>
<input type="checkbox" defaultChecked={innerThing[7]}/>
</SuperTD>
</TableRow>
</HtmlTooltip>
</>
在我的回傳塊上方，我有一個陣列，我想用它來存盤生成的每個表行的 ID。我有一個功能（從每個可見性按鈕的 onClick 觸發）。
我在陣列映射內的回傳塊中寫了這個：
{AR_RowRefs.push("rowID-" thing[0][0])}
但是，當我保存它并呈現時，它會創建一個額外的資料列：
<td>我認為只有在我周圍放置標簽時才會呈現額外的內容。這只是一個 JSX 片段，所以它創建自己的有什么特別的原因<td>嗎？我仍然可以在不渲染額外元素的情況下將此片段推送到陣列嗎？
uj5u.com熱心網友回復：
<td>我認為只有在我周圍放置標簽時才會呈現額外的內容。這只是一個 JSX 片段，所以它創建自己的有什么特別的原因<td>嗎？
瀏覽器正在嘗試從將數字（轉換為字串）作為 tr 的子項的錯誤中恢復。
我仍然可以在不渲染額外元素的情況下將此片段推送到陣列嗎？
快速而骯臟的方法（我尚未測驗過）是更改運算式，使其不會評估為數字。
{void AR_RowRefs.push("rowID-" thing[0][0])}
明智的做法是拆分資料操作邏輯和顯示邏輯。
Object.values(thing).map((innerThing, innerIndex) => {
AR_RowRefs.push("rowID-" thing[0][0]);
return <>
...
</>;
};
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/476468.html
標籤：javascript 反应 jsx