feat(Canvas): add type props (#2906)

This commit is contained in:
Lindy 2020-03-26 11:31:59 +08:00 committed by GitHub
parent dbe94b3bfa
commit b108eaf210
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 10 additions and 4 deletions

View File

@ -89,6 +89,7 @@ Page({
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| ------------ | -------------------------------------- | ------------------ | --------- | ---- |
| value | 目标进度 | *number* | `0` | - |
| type | 指定 canvas 类型,可选值为 `2d` `webgl` | *string* | - | - |
| size | 圆环直径,默认单位为 `px` | *number* | `100` | - |
| color | 进度条颜色,传入对象格式可以定义渐变色 | *string \| object* | `#1989fa` | - |
| layer-color | 轨道颜色 | *string* | `#fff` | - |

View File

@ -39,6 +39,10 @@ VantComponent({
value: BLUE,
observer: 'setHoverColor'
},
type: {
type: String,
value: ''
},
strokeWidth: {
type: Number,
value: 4
@ -62,8 +66,9 @@ VantComponent({
},
setHoverColor() {
const context = this.getContext();
const { color, size } = this.data;
const { color, size, type } = this.data;
const context = type ? this.getContext(type) : this.getContext();
let hoverColor = color;
if (isObj(color)) {
@ -111,8 +116,8 @@ VantComponent({
},
drawCircle(currentValue) {
const context = this.getContext();
const { size } = this.data;
const { size, type } = this.data;
const context = type ? this.getContext(type) : this.getContext();
context.clearRect(0, 0, size, size);
this.renderLayerCircle(context);