blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

chore(Circle): use tsx

Browse Source
This commit is contained in:
chenjiahan 2020-10-09 19:29:04 +08:00
parent 3460351ce3
commit d207902e47
2 changed files with 12 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/circle/README.zh-CN.md
View File

@ -134,7 +134,7 @@ export default {
| speed | 动画速度（单位为 rate/s） | _number \| string_ | `0` |
| text | 文字 | _string_ | - |
| stroke-width | 进度条宽度 | _number \| string_ | `40` |
| stroke-linecap | 进度条端点的形状，可选值为`sqaure` `butt` | _string_ | `round` |
| stroke-linecap | 进度条端点的形状，可选值为 `sqaure` `butt` | _string_ | `round` |
| clockwise | 是否顺时针增加 | _boolean_ | `true` |
### Slots

18
src/circle/index.js → src/circle/index.tsx
View File

@ -1,4 +1,4 @@
import { watch, computed } from 'vue';
import { watch, computed, PropType } from 'vue';
import { raf, cancelRaf } from '@vant/use';
import { isObject, getSizeStyle, createNamespace } from '../utils';
import { BLUE, WHITE } from '../utils/constant';
@ -7,11 +7,11 @@ const [createComponent, bem] = createNamespace('circle');
let uid = 0;
function format(rate) {
return Math.min(Math.max(rate, 0), 100);
function format(rate: string | number) {
return Math.min(Math.max(+rate, 0), 100);
}
function getPath(clockwise, viewBoxSize) {
function getPath(clockwise: boolean, viewBoxSize: number) {
const sweepFlag = clockwise ? 1 : 0;
return `M ${viewBoxSize / 2} ${
viewBoxSize / 2
@ -21,7 +21,7 @@ function getPath(clockwise, viewBoxSize) {
export default createComponent({
props: {
text: String,
strokeLinecap: String,
strokeLinecap: String as PropType<CanvasLineCap>,
currentRate: {
type: Number,
default: 0,
@ -76,7 +76,9 @@ export default createComponent({
const startTime = Date.now();
const startRate = props.currentRate;
const endRate = format(rate);
const duration = Math.abs(((startRate - endRate) * 1000) / props.speed);
const duration = Math.abs(
((startRate - endRate) * 1000) / +props.speed
);
const animate = () => {
const now = Date.now();
@ -91,7 +93,9 @@ export default createComponent({
};
if (props.speed) {
cancelRaf(rafId);
if (rafId) {
cancelRaf(rafId);
}
rafId = raf(animate);
} else {
emit('update:currentRate', endRate);