buen día, tengo una tabla con material-table
reactjs y necesito que me formatee los valores que me parecen en la columna valor
;
Por ejemplo "5000000" y necesito que aparezca por ejemplo "5.000.000", he intentado de muchas formas pero no lo he logrado, he intentado agregar en las constante de las columna valor
formatear el valor
pero no lo he logrado, si alguien me puede colaborar y encontrar la solución se los agradecería, envió el código que tengo:
también lo he intentado con la documentación pero no he podido : https://material-table.com/#/
import React, {useContext,useState,useEffect} from 'react';
import { AddBox, ArrowDownward } from "@material-ui/icons";
import MaterialTable from "material-table";
import axios from 'axios';
function Moneda () {
const baseUrlAd="https://miweb.com"
const [data, setData]=useState([]);
const peticionGet =async() =>{
await axios.get(baseUrlAd)
.then(response=>{
setData(response.data);
}).catch(error=>{
console.log(error);
})
}
const interval = setInterval(() => {
peticionGet();
}, 2000);
return () => setInterval(interval);
},[])
const columnas =[
{
title:"ID",
field: "id",
},
{
title:"C.EMPRESA",
field: "cargo"
},
{
title:'SUELDO BASE ($)',
field: 'valor',
// format: (field) => field.toLocaleString()
//sigue aparciendo el campo field 'valor sin los . "50000"
// render: rowData => rowData.valor.toLocaleString('es-MX')
//sigue aparciendo el campo field 'valor sin los . "50000"
// format: (field) => field.valor.toLocaleString('USD')
},
];
return (
<div id="content" class="app-content">
<div class="panel-body">
<MaterialTable
columns={columnas}
data={data}
title= {<><i class="fas fa-calculator fa-2x"></i></> }
backIconButtonText='Página anterior'
pagination
fixedHeader
actions={[
{
icon : 'calculate',
tooltip: 'Calcular',
onClick: (event, framework)=>seleccionarFramework(framework, "Editar")
},
]}
options={{
actionsColumnIndex: -1,
actionsCellStyle: {
},
headerStyle: { backgroundColor: "#348fe2", headerStyle: { position: 'sticky'}, boxShadow:"0 0 0 2px rgb(255,255,255)", color: "white", padding: "0.75rem 0.9375rem", fontSize: 10}
}}
localization={{
header:{
actions: 'ACCIONES'
},
body:{
emptyDataSourceMessage:'No hay registros que mostrar',
},
pagination: {
firstAriaLabel: 'Primera página',
firstTooltip: 'Primera página',
labelDisplayedRows: '{from}-{to} de {count}',
labelRowsPerPage: 'Filas por página:',
labelRowsSelect: 'filas',
lastAriaLabel: 'Ultima página',
lastTooltip: 'Ultima página',
nextAriaLabel: 'Pagina siguiente',
nextTooltip: 'Pagina siguiente',
previousAriaLabel: 'Pagina anterior',
previousTooltip: 'Pagina anterior',
},
toolbar: {
searchPlaceholder: 'Buscar',
searchTooltip: 'Buscar',
showColumnsAriaLabel: 'Mostrar columnas',
showColumnsTitle: 'Mostrar columnas',
},
}}
/>
</div>
</div>
)
}
}
export default Moneda