<p><pre class="brush:php;toolbar:false;">import React, { useState, useEffect } depuis "react" ; importer des axios depuis "axios" ; importer io depuis "socket.io-client" ; importer { DataGrid } depuis "@mui/x-data-grid" ; importer NaveBar depuis "../NaveBar/NaveBar" ; importer la SideBar depuis "../SideBar/SideBar" ; importer "./NewsTable.scss"; const socket = io("http://localhost:5000/"); const NewsTablee = () => { const [actualités, setNews] = useState([]); //mise à jour des nouvelles deeebd useEffect(() => { const fetchData = async () => { essayer { const allnews = wait axios.get("http://localhost:5000/api/news"); setNews(allnews.data.Date); } attraper (erreur) { console.log(erreur); } } ; socket.on("updateNewsTable", () => { récupérer les données (); }); }, [nouvelles]); useEffect(() => { axios .get("http://localhost:5000/api/news") .then((s) => { setNews(s.data.Date); }) .catch((euh) => { console.log(er); }); }, []); const message = () => { socket.emit("une actualité mise à jour", "une actualité mise à jour"); } ; colonnes const = [ { champ : "_id", headerName : "non", flexion : 0,5, renderCell : (paramètres) => { console.log(params.row.Index + 1); // ajoute cette ligne return <div>{(params.row.index + 1).toString()}</div> ; }, }, { field : "Titre", headerName : "Titre", flex : 3, triable : true }, { champ : "createdAt", headerName : "createdAt", flex : 2 }, { champ : "Nom d'utilisateur", nom d'en-tête : "Nom d'utilisateur", flex : 1 }, { field : "Resurce", headerName : "Resurce", flex : 1 }, { field : "Langue", headerName : "Langue", flex : 1 }, { field : "ProtectionLevel", headerName : "Protection Level", flex : 1 }, { champ : "priorité", nom d'en-tête : "Priorité", flex : 1 }, { field : "Media", headerName : "Media", flex : 1 }, ]; retour ( ≪> <NaveBar /> <Barre latérale /> <div className='content-wrapper' style={{ minHeight : "1172.56px" }}> <div className='NewsTableContainer'> <div className='headrt'> <bouton onClick={message} style={{ hauteur : 30, largeur : 30 }}></button> </div> <div style={{ hauteur : "570px", largeur : "100 %" }} className='newsTable'> <Grille de données lignes={actualités} colonnes={colonnes} getRowId={(ligne) => ligne._id} sortModel={[{ champ : "createdAt", tri : "desc" }]} /> </div> </div> </div> ≪/> ); };</pré> <p>导出默认NewsTablee;}</p> <p>返回行号为nan</p>

{
      field: "_id",
      headerName: "no",
      flex: 0.5,
      type: 'number', valueGetter: (params) =>  `${params.row.index + 1}`
    },