<progress>

Komponen <progress> bawaan peramban memungkinkan Anda untuk menampilkan indikator progres.

<progress value={0.5} />

Referensi
- <progress>
Penggunaan
- Mengontrol indikator progres

Referensi

`<progress>`

Untuk menampilkan indikator progres, render komponen <progress> bawaan peramban.

<progress value={0.5} />

Lihat lebih banyak contoh lainnya di bawah ini.

Props

<progress> mendukung semua elemen umum props.

Selain itu, <progress> juga mendukung props:

max: Sebuah angka. Menentukan nilai maksimum value. Default ke 1.
value: Angka antara 0 and max, atau null untuk progres menengah. Menentukan berapa banyak yang telah dilakukan.

Penggunaan

Mengontrol indikator progres

Untuk menampilkan indikator progres, render komponen <progress>. Anda dapat mengoper nilai value antara 0 dan nilai max yang anda tentukan. Jika Anda tidak memberikan nilai max, nilai tersebut akan dianggap sebagai 1 secara default.

Jika operasi tidak sedang berlangsung, berikan value={null} untuk mendapatkan indikator progres ke state tidak tentu (indeterminate).

Fork

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>