Primero, tengo la tabla antd y la fuente de datos de firestore con algunos campos e incluyo el campo de marca de tiempo. mis datos funcionan bien y los muestro en la tabla antd, el problema es que solo no se muestra el valor de la marca de tiempo.
este es el codigo
obtener datos
useEffect(() => { const unsub = //some code //some code //some code .onSnapshot((querySnapshot) => { let list = [] querySnapshot.forEach((doc) => { list.push({ id: doc.id, ...doc.data(), }) }) setData(list) setLoading(false) }) return () => { unsub() } },[])estructura de datos
[{id: '1', name: 'Gie', timestamp: {seconds: 1651770000, nanoseconds: 0}, {id: '2', name: 'Yud', timestamp: {seconds: 1652370000, nanoseconds: 0}]el formato de marca de tiempo es automáticamente del campo de marca de tiempo de firestore
mesa y mesa
<TableData pagination={{ position: ['bottomRight'], pageSize: 10, total: 0, showTotal: (total) => `Total ${total} item`, }} onChange={handleTable} columns={userColumns} dataSource={filterTable == null ? data : filterTable} rowKey={(record) => record.id} rowSelection={rowSelection} loading={loading} size="middle" />columna de usuario de la tabla antd
const userColumns = [ {//other column //other column }, { title: 'Timestamp', dataIndex: 'timestamp', key: 'timestamp', width: '12%', renderCell: (params) => { return <div>{params.timestamp.toDate()}</div> //doesnt work and not show anything }, sorter: (a, b) => a.timestamp - b.timestamp, sortOrder: sortedInfo.columnKey === 'timestamp' && sortedInfo.order, }, ]otro codigo lo estoy intentando y no funciona
{nueva fecha (params.timestamp).toDateString()}
{nueva fecha (params.timestamp).toLocaleDateString('id-ID')}
{nueva fecha (params.timestamp.seconds * 1000).toLocaleDateString('id-ID')}
pero cuando intento convertir con el mapa funciona perfectamente
const date = data.map((item) => {timestamp: new Date(item.timestamp.seconds * 1000).toLocaleDateString('id-ID')})
console.log(fecha) //salida: 5/6/2022
ACTUALIZACIÓN FIJADA
No sé por qué la tabla antd no puede convertir la marca de tiempo directamente en renderCell o render. así que elijo configurar los datos de Firestore de esta manera.
useEffect(() => { const unsub = //some code //some code //some code .onSnapshot((querySnapshot) => { let list = [] querySnapshot.forEach((doc) => { list.push({ id: doc.id, name: doc.data().name, timestamp: doc.data().timestamp, dateString: new Date(doc.data().timestamp.seconds * 1000).toLocaleDateString('id-ID') }) }) setData(list) setLoading(false) }) return () => { unsub() } },[])columna de usuario
const userColumns = [ {//other column //other column }, { title: 'Date', dataIndex: ['dateString', 'timestamp'], key: 'timestamp', width: '12%', render: (e, params) => { return <div>{params.dateString}</div> }, sorter: (a, b) => a.timestamp - b.timestamp, sortOrder: sortedInfo.columnKey === 'timestamp' && sortedInfo.order, }, ]Es difícil saberlo sin saber lo que está pasando al componente <Table /> real. Verifique que el contenido que se pasa a la columna con el índice de datos de timestamp de tiempo sea correcto.
Tengo la sensación de que sus datos se ven como
{ .... timestamp: "", ... } En cuyo caso, debería ser params.toDate() en lugar de params.timestamp.toDate() .