Radioknap

​

En radioknap er vælge input komponent, der giver brugerne mulighed for at vælge en mulighed fra en gruppe af foruddefinerede muligheder. Det vises som en afrundet firkantknap, som kan vælges eller fravælges af brugere. Når en radioknap er valgt, fravælges alle andre radioknapper i samme gruppe automatisk, at sikre, at der kun kan vælges én mulighed ad gangen. Radioknapper er almindeligt anvendt i formularer, spørgeskemaer og undersøgelser for at hjælpe brugerne med at foretage et enkelt valg fra en liste over muligheder.

​

Egenskaber

​

Manuelle indstillinger

Tilføj nye muligheder eller slet indstillinger manuelt og konfigurere mulighederne én efter én. Egenskaberne for muligheder er som følger:

​

Tilknyttede indstillinger

Du kan også tilføje indstillinger fra en datakilde ved at kortlægge etiket og værdi egenskaber til de tilsvarende datafelter. Du kan få indstillinger dynamisk fra databasen på denne måde. I slutningen af denne artikel vil vi vise, hvordan vi kan bruge den gennem et eksempel.

​

Andre egenskaber

​

Metode

Du kan bruge andre komponenter til at styre komponenten. Vi støtter følgende tre metoder:

​

setValue

For at angive den valgte indstilling, for eksempel, {{”value1”}}

​

clearValue

For at rydde de valgte indstillinger

​

validate

At kontrollere, at inputoplysningerne er lovlige

​

clearValidér

For at rydde valideringsmeddelelsen

​

Hændelse handler

Vi understøtter at lytte til begivenheden ‘onChange’ i radioknappen komponent.

Når den valgte indstilling ændres, kan den udløse en specificeret handling. Det betyder, at når en bruger vælger en anden mulighed end en gruppe af radioknapper, en særlig foranstaltning kan træffes på grundlag af den valgte mulighed. For eksempel i en webformular at vælge en anden mulighed kan udløse visningen af forskellige formularfelter eller indgivelsen af formularen til en anden destination. På denne måde kan den indstilling, der er valgt af brugeren påvirke adfærden af den software eller web-applikation, de bruger. Evnen til at udløse specificerede handlinger baseret på brugerinput er et vigtigt aspekt af interaktivt software design og kan forbedre anvendeligheden og funktionaliteten af softwaren.

​

Data

Komponenten har nogle almindeligt anvendte data, som kan kaldes via {{componentName.propertyName}} i appen.

​

Brug case

Dernæst vil vi demonstrere, hvordan man bruger den kortlagte tilstand til dynamisk at opnå muligheder.

​

Trin 1 Tilføj en handling

Vi har oprettet en tabel med navnet selection, herunder 5 kolonner: options_en, options_jp, options_zh, options_kr, value. Vi lagrede indstillingsværdierne i ‘værdi’ og gemte valgmuligheder etiket på forskellige sprog i andre kolonner.

Opret en handling for at liste alle data i ‘selection’ ved navn ‘postgresql1’

vælg * fra valg

​

Trin 2 Konfigurér komponenten

1. Sæt datakilderne til {{postgresql1.data}}

2. Indstil etiketten til at ændre etiketten baseret på sproget.

   1. Brug {{ item.columnName }} til at angive kolonnen.
   2. Benyt {{ currentUserInfo.language }} til at indstille sprogbrugernes brug i ILLA.

   {{currentUserInfo.language=='ja-JP' ? item.options_jp 
   : currentUserInfo.language == 'ko-KR' ? item.options_kr 
   : currentUserInfo.language == 'zh-CN' ? item.options_zh 
   : item.options_en }}