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

fix(RollingText): should render correctly when changing height prop (#11994)

Browse Source
This commit is contained in:
inottn 2023-06-23 17:06:10 +08:00 committed by GitHub
parent 6b8a83eefc
commit 00da05be47
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 11 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
packages/vant/src/rolling-text/RollingTextItem.tsx
View File

@ -34,28 +34,26 @@ export default defineComponent({
? props.figureArr.slice().reverse()
: props.figureArr
);
const totalHeight = computed(
() => props.height * props.figureArr.length - props.height
);
const translateValPx = computed(() => `-${totalHeight.value}px`);
const itemStyleObj = {
const translatePx = computed(() => {
const totalHeight = props.height * (props.figureArr.length - 1);
return `-${totalHeight}px`;
});
const itemStyle = computed(() => ({
lineHeight: addUnit(props.height),
};
const getStyle = () => ({
}));
const rootStyle = computed(() => ({
height: addUnit(props.height),
'--van-translate': translateValPx.value,
'--van-translate': translatePx.value,
'--van-duration': props.duration + 's',
'--van-delay': props.delay + 's',
});
}));
return () => (
<div class={bem([props.direction])} style={getStyle()}>
<div class={bem([props.direction])} style={rootStyle.value}>
<div class={bem('box', { animate: props.isStart })}>
{Array.isArray(newFigureArr.value) &&
newFigureArr.value.map((figure) => (
<div class={bem('item')} style={itemStyleObj}>
<div class={bem('item')} style={itemStyle.value}>
{figure}
</div>
))}