blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-05-22 22:49:15 +08:00
Code Issues Projects Releases Wiki Activity

chore(Progress): use tsx

Browse Source
This commit is contained in:
chenjiahan 2020-10-09 19:51:28 +08:00
parent ff61e25f10
commit eda4de93ae
1 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/progress/index.js → src/progress/index.tsx
View File

@ -15,7 +15,7 @@ export default createComponent({
percentage: {
type: [Number, String],
required: true,
validator: (value) => value >= 0 && value <= 100,
validator: (value: number | string) => value >= 0 && value <= 100,
},
showPivot: {
type: Boolean,
@ -24,8 +24,8 @@ export default createComponent({
},
setup(props) {
const root = ref();
const pivotRef = ref();
const root = ref<HTMLElement>();
const pivotRef = ref<HTMLElement>();
const state = reactive({
rootWidth: 0,
@ -38,7 +38,7 @@ export default createComponent({
const setWidth = () => {
nextTick(() => {
state.rootWidth = root.value.offsetWidth;
state.rootWidth = root.value ? root.value.offsetWidth : 0;
state.pivotWidth = pivotRef.value ? pivotRef.value.offsetWidth : 0;
});
};
@ -46,11 +46,11 @@ export default createComponent({
const renderPivot = () => {
const { rootWidth, pivotWidth } = state;
const { textColor, pivotText, pivotColor, percentage } = props;
const text = pivotText ?? percentage + '%';
const text = pivotText ?? `${percentage}%`;
const show = props.showPivot && text;
if (show) {
const left = ((rootWidth - pivotWidth) * percentage) / 100;
const left = ((rootWidth - pivotWidth) * +percentage) / 100;
const style = {
color: textColor,
left: `${left}px`,
@ -77,7 +77,7 @@ export default createComponent({
};
const portionStyle = {
background: background.value,
width: (state.rootWidth * percentage) / 100 + 'px',
width: (state.rootWidth * +percentage) / 100 + 'px',
};
return (