react instascan - react instascan

react instascan

Kode sumber lainnya

1.0.0

Unduh

Bereaksi Instascan

Port perpustakaan Instascan ke React

Peringatan

Pustaka ini menggunakan instascan-umd bukan instascan sebagai per-dependensi. Jika Anda mengupgrade ke versi yang lebih baru, Anda harus menginstal istascan-umd .

Menginstal

npm

npm install react-instascan react instascan-umd --save

benang

yarn add react-instascan react instascan-umd

Menggunakan CDN unpkg

 < script type =" application/javascript " src =" https://unpkg.com/react-instascan/dist/main.js " > </ script >

Persyaratan

Untuk menggunakan perpustakaan ini, Anda memerlukan setidaknya:

bereaksi >= 16.3
instascan-umd >= 1

Menggunakannya

Pengimporan

React Instascan memaparkan dua Komponen: Kamera dan Pemindai .
Dengan ESModul:

 import { Cameras , Scanner } from "react-instascan" ;

atau dengan CommonsJS:

 const { Cameras , Scanner } = require ( "react-instascan" ) ;

Komponen "Kamera" dengan prop render dan akan mengambil kamera yang tersedia di perangkat Anda.
Komponen Pemindai menerima sebagai penyangga kamera dan VideoHTMLElement sebagai elemen turunan. Kemudian ia akan memanggil pendengar onScan saat membaca kode. Jenis acara lainnya juga tersedia (periksa tabel API):

 < Cameras >
  { cameras => (
    < div >
      < h1 > Scan the code! < / h1 >
      < Scanner camera = { cameras [ 0 ] } onScan = { onScan } >
        < video style = { { width : 400 , height : 400 } } / >
      < / Scanner >
    < / div >
  ) }
< / Cameras >

Properti pemindai

nama	jenis	keterangan
kamera	obyek	Objek kamera dikembalikan oleh <Kamera />
pilihan	obyek	Opsi yang sama dari Instascan.Scanner
berhenti	boolean	Jika stop benar maka kamera akan berhenti dan sebaliknya
di Pemindaian	fungsi	Dipancarkan ketika kode QR dipindai menggunakan kamera dalam mode berkelanjutan
diMulai	fungsi	Dipanggil ketika kamera aktif dan pemindaian telah dimulai
diBerhenti	fungsi	Dipanggil ketika kamera dan pemindaian berhenti
aktif	fungsi	Dipancarkan ketika pemindai menjadi aktif karena berhenti menjadi salah atau tab mendapatkan fokus
aktif	fungsi	Dipancarkan ketika pemindai menjadi tidak aktif akibat berhenti menjadi kenyataan atau tab kehilangan fokus

Untuk lebih jelasnya periksa API Instascan

Berkontribusi

Menggunakan langsung dari sumbernya

Meskipun proyek ini dilengkapi dengan contoh sederhana, Anda mungkin ingin menggunakan kode ini langsung pada kode Anda untuk menguji dan memperbaiki kemungkinan bug. Untuk itu Anda cukup menautkan paket ini saja