Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

139
Vistas
React Fuse Component error for default export

I have this code to add div to table onclick, but I have added it from Stack to a Fuse project which has its own template. Please have a look at this code, I think there is a very simple problem with it. I am new to React, and I don't understand, how can I export the class. Whatever I tried, there is an error on it. Here is the code:

const useStyles = makeStyles({
  layoutRoot: {},
});


  Class Mdf extends React.Component ({
getInitialState: function () {
    return {
        tablerows: [
            { fname: "Tom", lname: "Moody", age: 23 }
        ]
    };
},
addRow: function () {
    // add new data from here    
    var newdata = { fname: "Tom", lname: "Moody", age: 23 }
    //take the existing state and concat the new data and set the state again    
    this.setState({ tablerows: this.state.tablerows.concat(newdata) });
},
rows: function () {
    return this.state.tablerows.map(function (row, i) {
        return (<tr key={i}>
            <td>{row.fname}</td>
            <td>{row.lname}</td>
            <td>{row.age}</td>
        </tr>);
    });
},

render: function () {
  const classes = useStyles();
    return (
      <FusePageSimple
      classes={{
        root: classes.layoutRoot,
      }}
      header={
        <div className="p-24">
          <h1>Site Details</h1>
        </div>
      }
      contentToolbar={
        <div className="px-24">
          <h4>Content Toolbar22222</h4>
        </div>
      }
      content={
        <div className="p-24">
        <div>
            <table>
                <tr>
                    <td> row 1 </td>
                </tr>
                <tr>
                    <td> row 2 </td>
                </tr>
                <tr>
                    <td> row 3 </td>
                </tr>
                {this.rows()}
            </table>
            <button id="addBtn" onClick={this.addRow}>ADD</button>
        </div>
        </div>
      }
      />
    );
}
});

// React.render(<Mdf />)

export default Mdf

And the error message which shows up is this:

Attempted import error: './Mdf' does not contain a default export (imported as 'Mdf').
about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda