npm.io
1.0.0 • Published 6 years ago

view-avatar

Licence
MIT
Version
1.0.0
Deps
3
Size
70 kB
Vulns
1
Weekly
0
Stars
1

a vue component -> view-avatar

源码文件 /src/index

打包后文件 /dist/index

How to use

  1. 安装 npm i -S view-avatar

  2. 在.vue文件中引入

​

  <script>    
  import ViewAvatar from 'view-avatar'
  export default {
    components: { ViewAvatar }
  }

  </script>

具体请运行 npm run dev 查看demo

代码请看example文件夹

Attributes
参数 说明 类型 可选值 默认值
src 图片src地址 String — —
text 生成图片的源文字 String — —
width 宽度 String (px)
height 高度 String (px)
quickWidth 当不想使用width,height,使用此属性可以直接设置宽高一样的值 String (px)
color 文字默认颜色 String — —
bgColor 图片默认底色 String
colors 图片的文字颜色组,当不设置color时,根据文字MD5的值,设置图片的文字颜色 String
bgColors 图片的底色颜色组,当不设置bgColor时,根据文字MD5的值,设置图片的底色颜色 String
borderRadius 图片显示形状,可以显示为圆形的方式,也可以设置关闭,默认有2px的border-radius String
textImgError 当图片显示错误时是否使用文字的方式显示图片,如不使用则默认用图片错误的方式处理 Boolean false
styles 图片的颜色style样式,可以覆盖文字,底色颜色等 Object {}
enablePopper 是否使用popper显示图片的信息,tooltips的效果 Boolean false
placement 使用的popper出现的位置(top, right, bottom, left) String top
popperOptions popper的options属性(vue-popperjs)
slot
—(默认方式) 直接自定义图片
imgError 图片错误处理
text 文字自定义显示
popper-text 自定义显示tooltips的内容
LICENSE

MIT

Keywords