reagieren | Material ui | AutoVervollständigen | Wie ID als Wert in OnNewRequest zuweisen

Question

Ich habe eine AutoComplete Komponente von Material-UI Bibliothek. Es gibt einen Weg, um es als wählen zu zeigen, mit menuItem Komponenten:

const dataSource = [ 
    { 
    text: name1, 
    value: <MenuItem 
     primaryText={name1} 
     value={id1} 
    /> 
    }, 
    { 
    text: name2, 
    value: <MenuItem 
     primaryText={name2} 
     value={id2} 
    /> 
    } 
]; 

Alles sieht gut aus, aber funktioniert nicht. Das erste Problem ist, wenn ich ein Element aus der Liste wähle, erscheint es nie als Feldwert. Ich kann es im Formularfeld sehen, aber zum Backend wird nur diese Zeichenfolge geschickt, die ich manuell in Feld eingegeben habe. Ich habe festgestellt, dass eine der übergebenen Eigenschaften meinen Anforderungen entsprechen kann - onNewRequest. Es gibt alle Daten, die ich brauche, aber immer noch nicht finden kann, wie ich die ID zuweisen kann, die ich in chosenRequest Objekt finden kann, übergeben an diese Funktion, Feldwert.

Answer 1

Haben Sie die neue Version von MUI ausgecheckt? Das neue Release (v0.15.1) enthält eine 'dataSourceConfig' als neue Eigenschaft. Dadurch können Sie ein Array von Objekten in 'dataSource' übergeben und dann in 'dataSourceConfig' können Sie 'text' und 'value' wie in der API erläutert setzen. Außerdem ist es toll, dass Sie das ausgewählte Objekt an onNewRequest übergeben haben!

Auschecken http://www.material-ui.com/#/components/auto-complete.

Answer 2

zu erreichen, dass Sie die dataSourceConfig wie folgt verwendet werden:

const dataSourceConfig = { 
    text: 'textKey', 
    value: 'valueKey', 
}; 

hier mehr sind Beispiele https://github.com/callemall/material-ui/blob/master/docs/src/app/components/pages/components/AutoComplete/ExampleDataSources.js