vue条形码生成插件vue-barcode
更详细的请查阅官方文档
https://github.com/lindell/vue-barcode
vue-barcode是JsBarcode的一个简单包装。所以在使用时的配置属性需要在JsBarcode中查看
JsBarcode官方文档
https://github.com/lindell/JsBarcode
安装
npm install @xkeshi/vue-barcode vue
引入注册组件
import VueBarcode from '@xkeshi/vue-barcode';
使用组件
<barcode :value="barcodeValue">
条形码显示失败时的内容
</barcode>
注意点:value值需要给一个初始值,或者使用v-if在没有收到参数时不渲染节点,这样后台就不会报错
我在工作中用到的配置
<barcode
v-if="userlist.diseaseName"
:value="userlist.examineNumber"
:options="{ widht:100,height:50,
background:'rgba(255,255,255,.0)'}"></barcode>
options中使用JsBarcode的属性,需要注意的是条码除了黑色,其他的颜色都不能被识别,或快速识别 不驰于空想,不鹜于虚声
vue条形码生成插件vue-barcode的更多相关文章
- vscode vue 模版生成,vue 一键生成
vscode vue 模版 继上篇文章(vue 格式化),顺便记录下 vue 模版生成.图片就不在贴了,如果有找不到 vscode 插件商店的可以访问上篇文章. 一.安装 VueHelper 在 vs ...
- Vue Google浏览器插件 Vue Devtools无法使用的解决办法
1.插件安装不必多说 一定要用Vue.js 开发版 Vue.min.js 在控制面板就不会显示 2.本地调试 用的是file://协议 修改插件允许访问文件网址 打上对勾
- Vue安装及插件Vue Devtools
vue安装: # 最新稳定版 $ npm install vue # 全局安装 vue-cli $ npm install --global vue-cli # 创建一个基于 webpack 模板的新 ...
- 基于Vue cli生成的Vue项目的webpack4升级
前面的话 本文将详细介绍从webpack3到webpack4的升级过程 概述 相比于webpack3,webpack4可以零配置运行,打包速度比之前提高了90%,可以直接到ES6的代码进行无用代码剔除 ...
- [vue]初探vue生态核心插件Vuex
为什么会有 Vuex 这个东西 ? 一个应用内部运行的机制,事件 -> 状态 -> UI,我们的前端常常会因为这两个过程而产生大量代码,从而变得难以维护. vue的声明式渲染,解决了从 状 ...
- vue之自定义插件
1.插件的作用 插件通常会为 Vue 添加全局功能,一般是添加全局方法/全局指令/过滤器等 Vue 插件有一个公开方法 install ,通过 install 方法给 Vue 添加全局功能 通过全局方 ...
- webpack + vue 项目 自定义 插件 解决 前端 JS 版本 更新 问题
Webpack 是一个前端资源加载/打包工具.它将根据模块的依赖关系进行静态分析,然后将这些模块按照指定的规则生成对应的静态资源. 它的异步加载原理是,事先将编译好后的静态文件,通过js对象映射,硬编 ...
- vue封装第三方插件并发布到npm
前言 写此文前特意google了一下,因为有较详细的开发教程我再写意义不大,有把插件封装成组件的教程,有把自己的组件封住成插件的教程,本文主要说明如何把第三方的插件封装成vue插件,简化配置,一键安装 ...
- Vue 去脚手架插件,自动加载vue文件,style怎么办
书接上上会,因为当时也没想好怎么办,所以装聋作哑的忽略了Vue文件中的Style,Vue的做法我看着晕乎乎的,细想的话,无非就是自动填写到dom中,所担心的无非是命名冲突. 在一个项目中(像我这种自娱 ...
随机推荐
- yandexbot ip列表整理做俄罗斯市场的站长可以关注一下
这段时间ytkah在负责一个客户的网站,主要做俄罗斯市场,当然是要研究Yandex了,首先是要知道yandexbot的ip有哪些,本文通过分析这个站从2018.12.02到2019.05.21这段时间 ...
- Vyos的基本配置
修改用户密码 Enter configuration mode configure Set password set system login user [username] authenticati ...
- html--前端基本标签内容讲解
body里面分为两类标签:块级标签和内联标签. 1.块级标签:<p><h1><table><ol><ul><form><d ...
- Taro-UI 2.0样式在H5上生效,微信小程序不生效?
答案: https://taro-ui.aotu.io/#/docs/questions taro-ui 自定义样式覆盖小程序组件样式使用到了 globalClass 这个微信小程序特性,由于微信小程 ...
- Utterance-level Aggregation for Speaker Recognition in The Wild
文章[1]主要针对的是语句长度不定,含有不相关信号的说话人识别. 深度网络设计的关键在于主干(帧级)网络的类型[the type of trunk (frame level) network]和有时间 ...
- docker的简单操作和端口映射
一:简介 Docker镜像 在Docker中容器是基于镜像启动的 镜像是启动容器的核心 镜像采用分层设计,最顶层为读写层 使用快照COW技术,确保底层不丢失 通过ifconfig(ip a)来查看d ...
- Layui 隐藏左侧菜单
简单实现 //隐藏菜单 var bl = $("#LAY_app_flexible").hasClass("layui-icon-shrink-right"); ...
- [RN] React Native 获取验证码 按钮
React Native 获取验证码 按钮 效果如图: 实现方法: 一.获取验证码 按钮组件 封装 CountDownButton.js "use strict"; import ...
- 虚方法(virtual)\抽象方法(abstract)\接口(interface)的区别
转自:https://www.cnblogs.com/fantaohaoyou/p/9402657.html 虚方法和抽象方法都可以供派生类重写,它们之间有什么区别呢? 1. 虚方法必须有实现部分,抽 ...
- Centos开发小计
1. 生成静态库,linux下库的规则是lib开头 g++ -c code.cpp ar cr libcode.a code.o