QR code
Encode text / URL into an SVG QR code, fully client-side and zero-dependency (Byte mode, auto-selects version 1–40).
Basic usage
value is the string to encode (any UTF-8). ecc controls the error-correction level — higher levels need a denser grid for the same payload but tolerate more damage.
QR 矩阵在客户端实时计算(Byte 模式,自动选版本)。
<CfQRCode :value="value" :size="160" ecc="M" /> <CfQRCode value={value} size={160} ecc="M" /> API
| Prop | Type | Default | Description |
|---|---|---|---|
value | string | — | Content to encode (UTF-8) |
ecc | 'L' | 'M' | 'Q' | 'H' | 'M' | Error-correction level (~7% / 15% / 25% / 30%) |
size | number | 160 | Render size (pixels) |
margin | number | 2 | Quiet-zone modules |
color | string | 'currentColor' | Dark-module color |
background | string | 'transparent' | Background color |
Implementation note: a built-in Byte-mode QR encoder selects the smallest version (1–40) that fits the data. The algorithm is adapted from Project Nayuki’s MIT reference implementation.
反馈与讨论
QR code · Discussion