zpao / qrcode.react

A <QRCode/> component for use with React.
https://zpao.github.io/qrcode.react/
Other
3.82k stars 327 forks source link

QRCodeSVG renders as Canvas instead of SVG #343

Closed chasemcdo closed 4 months ago

chasemcdo commented 4 months ago

In order to get QRCodeSVG to render as an SVG I have to pass in renderAs="svg". Otherwise I am seeing it render as a Canvas.

zpao commented 4 months ago

Can you share code reproducing the issue? I haven't seen that before.

Is it possible you're aliasing at import? For example…

import {QRCode as QRCodeSVG} from 'qrcode.react';
chasemcdo commented 4 months ago

I simply have the following: import QRCodeSVG from "qrcode.react";

With the following for displaying:

<QRCodeSVG
  value={link}
  renderAs="svg"
  width={130}
  height={130}
/> 

where when I had omitted the renderAs param it displayed as a canvas. I noticed since my current use case doesn’t seem to work with Canvas containers and when inspecting that appeared to be the issue which was resolved by adding the param.

chasemcdo commented 4 months ago

Now noticing my lack of curly brackets which is likely leading to an unintentional aliasing of the default export

zpao commented 4 months ago

Ah yea, that would do it! In v4, I'm dropping the default export. It wasn't actually because of the potential confusion, just that it didn't add any value over the explicit svg/canvas components and hampered differentiation.

Glad you got it worked out!