?????????在用組件對前端項目進行開發時，我們會遇到以下情況：項目原型中有取值范圍這個表字段，需要存放最小取值到最大取值。

? ? ? ? 而后端返回給我們的數據是返回了一個最小值和一個最大值，?

? ? ? ? 在columns中我們需要對這兩個字段進行拼接，使其在前端界面展示成min-max的樣式。下面是我的columns字段配置方式。

const columns = [{title: '取值范圍',dataIndex: 'minmax',hideInSearch: true,render: (text, a) => {console.log(text, a);return <span>{a.min}-{a.max}</span>}},
]

??render屬性是這段代碼中最為關鍵和靈活的部分。它是一個函數，用于自定義這一列每一行數據的渲染方式。這個函數接收兩個參數：

• text：通常情況下，它應該是dataIndex對應字段的值。但在我們這個自定義渲染的例子中，text的值可能并非我們最終想要展示的內容，它在這里的作用相對有限。
• a：這個參數代表當前行的數據對象。它包含了當前行所有字段及其對應的值，就像是一個包含了整行數據信息的小包裹。

????????在函數內部，首先使用console.log(text, a)打印出text和當前行的數據對象a。這一步在開發調試過程中非常有用，我們可以通過控制臺輸出，清晰地查看傳入的參數值，了解數據的具體情況，以便及時發現和解決可能出現的問題。

????????接著，函數返回一個<span>元素，其內容為{a.min}-{a.max}。這意味著在表格中 “取值范圍” 這一列的每一行，都會將當前行數據對象中的min字段值和max字段值用連字符-連接起來進行顯示。例如，如果某一行數據對象中min的值為10，max的值為20，那么在表格的這一行 “取值范圍” 列中，就會顯示10 - 20。通過這種自定義的渲染方式，我們可以將原本分散在數據對象中的最小值和最大值，以一種直觀且符合需求的方式展示在表格中。

????????下面是前端界面展示效果