Package Exports
- ivu-gradient-selector
- ivu-gradient-selector/src/index.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (ivu-gradient-selector) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
ivu-gradient-selector
安装
npm install ivu-gradient-selector
由于依赖
view-design
,务必在main.js
中引入view-design
import ViewUI from "view-design"
import "view-design/dist/styles/iview.css"
Vue.use(ViewUI)
引入并注册
import IvuGradientSelector from "ivu-gradient-selector"
export default {
components: {
IvuGradientSelector,
},
}
在 Vue
项目中使用
<template>
<div>
<!-- ... -->
<div style="width: 400px">
<GradientSelector
:startColor.sync="initialColor[0]"
:endColor.sync="initialColor[1]"
:range.sync="range"
/>
</div>
</div>
</template>
属性介绍(加 *
的为必传)
属性名 | 类型 | 默认值 | 介绍 |
---|---|---|---|
defaultColor | String | #000000 | 点击清空后,展示的颜色 |
barHeight | Number | 10 | 渐变条的高度,10 ~ 100 之间 |
*startColor | String | #2193b0 | 渐变开始的颜色 |
*endColor | String | #fb0000 | 渐变结束的颜色 |
*range | Array | [0, 100] | 渐变范围 |
属性:startColor_、_endColor 和 _range_,组件内部会自动调用
$emit('update:[属性名]', val)
更新最新的值,在绑定属性时,添加修饰符sync
即可。若想自定义属性更新事件,绑定对应的update:[属性名]
即可。