Perché <lightning-input-field> non imposta il valore delle caselle di controllo in LWC?

Aug 17 2020

Ricevo dati nel mio LWC da una classe wrapper. In quei dati, ottengo il nome dell'API dell'oggetto, il nome dell'API del campo e il valore presente nel campo sotto forma di stringhe. Eseguo l'iterazione dei dati dalla classe wrapper e prendo l'input dell'utente che utilizza lightning-input-field.

Codice:

<!-- iterate over wrapper list -->
<template iterator:item={wrapperListCopy}>
     <tr key={item.value.index}>
           <td>
                <lightning-record-edit-form object-api-name={objectApiName}>
                     <lightning-input-field id={item.value.index} 
                                            field-name={item.value.inputFieldName} 
                                            value={item.value.filterValue}>
                     </lightning-input-field>
                </lightning-record-edit-form>
           </td>
     </tr>
</template>

La filterValuearriva in formato stringa. Questo codice funziona per tutti i campi tranne le caselle di controllo. Anche se filterValuecontiene trueo false, lo stesso non si riflette sulla casella di controllo nell'interfaccia utente. Per impostazione predefinita, la casella di controllo appare selezionata sull'interfaccia utente indipendentemente dal valore presente in filterValue.

Significa che la casella di controllo non sta ottenendo valore dall'attributo valuedi lightning-input-field. Inoltre, la casella di controllo appare sempre selezionata per impostazione predefinita nell'interfaccia utente. Voglio che sia deselezionato per impostazione predefinita. Non sono in grado di capire perché sta accadendo.

È perché filterValueè una stringa? - Ho bisogno che sia una stringa perché tutti gli altri campi la stanno utilizzando.

O è perché uso l' valueattributo anziché l' checkedattributo? - Ho ricevuto un errore dicendo che non esiste un tale checkedattributo.

Per favore aiuto. Grazie! 😄

Risposte

4 PhilW Aug 17 2020 at 20:59

Probabilmente a causa delle regole di conversione del tipo di JavaScript; una stringa viene convertita in un booleano nel modo seguente:

  • una stringa non definita, nulla o vuota (ad esempio "") diventa false
  • una stringa che non è nessuna delle precedenti diventa true

Pertanto, le stringhe "true" e "false" diventano entrambe truebooleane. È necessario modificare il modo in cui viene generato o utilizzato filterValue per risolvere questo problema. Ad esempio, assicurati che filterValue sia impostato su null per false e "true" altrimenti.