Blur

demo 原始链接demo 源码编辑文档组件源码

blur - 图1

二维码

blur - 图2

安装

局部注册

全局注册

  1. import { Blur } from 'vux'
  2. export default {
  3. components: {
  4. Blur
  5. }
  6. }

  1. // 在入口文件全局引入
  2. import Vue from 'vue'
  3. import { Blur } from 'vux'
  4. Vue.component('blur', Blur)

当前组件使用svg实现模糊效果。如果在手机上渲染过慢,可以尝试直接使用css3的blur filter

属性

名字类型默认值说明版本要求
blur-amountnumber10模糊程度
urlstring图片地址
heightnumber200容器高度

插槽

名字说明版本要求
默认插槽容器内容,显示在模糊内容上面

贡献者

该组件(包含文档)迭代次数 6,贡献人数 2airylandLin Sen