Qrcode 二维码

用于根据文本内容生成二维码，支持尺寸、颜色、边距、容错级别、Logo 叠加以及导出图片能力。

示例

基础用法

自定义样式

Logo 和导出

API

Props

属性名	说明	类型	默认值
value	二维码内容	string	必填
size	二维码尺寸，单位 px	number	100
margin	边距模块数	number	0
color-dark	深色模块颜色	string	'#000000'
color-light	浅色背景颜色	string	'#ffffff'
error-level	容错级别	'L' | 'M' | 'Q' | 'H'	'M'
logo	Logo 图片地址	string	''
logo-size	Logo 尺寸占二维码比例，范围 0-1	number	0.2

Events

该组件无自定义事件。

Slots

该组件无插槽。

Exposes

方法名	说明	类型
toImage	获取二维码图片 Base64 地址	() => string
downloadImage	下载二维码图片	(fileName?: string) => unknown

注意事项

• 组件将二维码内容绘制为图片后展示。
• value 为空时不会生成二维码。
• 当前仅监听 value 和 logo 变化后重新生成二维码；动态修改 size、margin、color-dark、color-light、error-level、logo-size 不会立即触发重新生成，需要同时更新 value 或重新挂载组件。
• toImage 和 downloadImage 依赖已生成的图片数据，建议在组件渲染完成后调用。
• 设置 logo 后会将图片转为 Base64 并绘制在二维码中心，跨域图片需要允许浏览器读取资源。
• downloadImage 默认文件名为 qrcode.png。
• 二维码内容建议保持简短，提升识别率。
• 使用 Logo 时建议提高容错级别并控制 Logo 尺寸。