<progress>

Selaimen sisäänrakennettu <progress>-komponentti mahdollistaa edistymisindikaattorin renderöinnin.

<progress value={0.5} />

Viite
- <progress>
Käyttö
- Edistymisindikaattorin ohjaaminen

Viite

`<progress>`

Näyttääksesi edistymisindikaattorin, renderöi selaimen sisäänrakennettu <progress>-komponentti.

<progress value={0.5} />

Näe lisää esimerkkejä alla.

Propsit

<progress> tukee kaikkia yleisien elementin propseja.

Lisäksi, <progress> tukee näitä propseja:

max: Numero. Määrittelee value:n enimmäismäärän. Oletuksena 1.
value: Numero 0 ja max:n väliltä, tai null for määrittämättömään edistymiseen. Määrittelee miten paljon on tehty.

Käyttö

Edistymisindikaattorin ohjaaminen

Näyttääksesi edistymisindikaattorin, renderöi <progress>-komponentti. Voit antaa numeron value väliltä 0 ja max-arvon, jonka määrität. Jos et anna max-arvoa, oletetaan sen olevan 1 oletuksena.

Jos operaatio ei ole käynnissä, anna value={null} asettaaksesi edistymisindikaattorin määrittelemättömään tilaan.

Forkkaa

export default function App() {
  return (
    <>
      <progress value={0} />
      <progress value={0.5} />
      <progress value={0.7} />
      <progress value={75} max={100} />
      <progress value={1} />
      <progress value={null} />
    </>
  );
}

Previous<option>Next<select>