Pass auf this.state meine Zeilen und ihre JSON-Schema

Question

Ich bin stecken in einem Problem, das ich mein Schema und mein Json an meinen Konstruktor übergeben muss. Zuerst verwende ich Reactabular, um ein SPA zu entwickeln, aber in dieser Bibliothek kann ich die Anwendung nur mit einer Funktion starten, die sie erzeugt haben, generateRows, , aber ich habe meine eigenen Objekte zu injizieren, also will ich nicht um Zeilen zu generieren.

In meiner Komponente habe ich dieses Stück Code:

class AllFeaturesTable extends React.Component { 
    constructor(props) { 
    super(props); 

    this.state = { 
     rows: generateRows(5, schema), 
     searchColumn: 'all', 
     query: {}, // search query 
     sortingColumns: null, 
     columns: this.getColumns(), 
     pagination: { 
     page: 1, 
     perPage: 5 
     } 
    }; 

Wenn ich meine Zeilen als JSON-Objekt Array alles passieren funktioniert gut, bis ich versuche, diese Werte zu bearbeiten, und macht Sinn, warum ich dies nicht bearbeiten Daten. Ich kann nicht, weil ich das Schema nicht bestanden habe (wie ihr in den Generatoren sehen könnt, die sie als Parameter für das Schema genommen haben).

Meine Frage ist, wie kann ich das erreichen? übergeben Sie mein this.state.row das Schema und meine Zeilen.

Dies ist meine Zeilen:

const predefinedRows = [ 
    { "combustivel" : "Flex", 
    "imagem" : null, 
    "marca" : "Volkswagem", 
    "modelo" : "Gol", 
    "placa" : "FFF-5498", 
    "valor" : 20000 
    }, 
    { "combustivel" : "Gasolina", 
    "imagem" : null, 
    "marca" : "Volkswagem", 
    "modelo" : "Fox", 
    "placa" : "FOX-4125", 
    "valor" : "20000" 
    }, 
    { "combustivel" : "Alcool", 
    "imagem" : "http://carros.ig.com.br/fotos/2010/290_193/Fusca2_290_193.jpg", 
    "marca" : "Volkswagen", 
    "modelo" : "Fusca", 
    "placa" : "PAI-4121", 
    "valor" : "20000" 
    } 

]; 

und das ist mein Schema:

const schema = { 
    type: 'object', 
    properties: { 
    combustivel: { 
     type: 'string' 
    }, 
    imagem: { 
     type: 'string' 
    }, 
    marca: { 
     type: 'string' 
    }, 
    modelo: { 
     type: 'string' 
    }, 
    placa: { 
     type: 'string' 
    }, 
    valor: { 
     type: 'integer' 
    } 
    }, 
    required: ['combustivel', 'imagem', 'marca', 'modelo', 'placa'] 
}; 

Vielen Dank im Voraus!

Answer 1

Sie sollten generateRows nicht verwenden. generateRows eingeführt here, nur eine Dummy-Array-Daten zurückgeben.

Folgen Sie einfach der example, um Ihre Komponente zu implementieren. Wenn Sie alle Funktionen verwenden möchten, übergeben Sie das Schema und die Zeilen an this.state.row. Tun Sie das einfach:

this.state = { 
     row: { 
     rows: yourRows, 
     schema: yourSchema 
     }, 
     searchColumn: 'all', 
     query: {}, // search query 
     sortingColumns: null, 
     columns: this.getColumns(), 
     pagination: { 
     page: 1, 
     perPage: 5 
     } 
    };