vue项目中使用vue-qr 中间设置小图片logo模糊问题

背景:vue中使用二维码插件vue-qr中间配置logo图片的时候,发现中间图片比较模糊,并且模糊程度和二维码所配置的字符串的长短也有关系,查找源码,发现确实存在这个问题,并且还没有相应的配置
解决办法:用一个和中心配置的logo图片大小一样的图片定位到二维码中心
代码如下

   

并且可以配置二维码数据返回之前实现模糊的效果使用上面代码中filter属性
在data中定义如下

 data() {
    return {
      cssFilter: 'blur(8px)'
      }
   }

在请求接口前设置为

this.cssFilter = 'blur(0px)';

请求到二维码数据之后设置为:

this.cssFilter = 'blur(0px)';

你可能感兴趣的:(vue.js,javascript,ecmascript)