admin/wot-design-uni
1
0
Fork 0
mirror of https://gitee.com/wot-design-uni/wot-design-uni.git synced 2025-12-07 17:48:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor: ♻️ Tabs 设置激活项方法setActive调整为立即执行 (#733)

Browse Source
This commit is contained in:
不如摸鱼去 2024-11-24 14:12:28 +08:00 committed by GitHub
parent c38321f69c
commit 933c2b1da0
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 3 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/uni_modules/wot-design-uni/components/wd-tabs/wd-tabs.vue
View File

@ -219,7 +219,7 @@ const updateActive = (value: number | string = 0, init: boolean = false, setScro
* @param {String |Number } value - radio绑定的value或者tab索引，默认值0 * @param {String |Number } value - radio绑定的value或者tab索引，默认值0
* @param {Boolean } init - 是否伴随初始化操作 * @param {Boolean } init - 是否伴随初始化操作
*/ */
const setActive = debounce(updateActive, 100, { leading: false }) const setActive = debounce(updateActive, 100, { leading: true })
watch( watch(
() => props.modelValue, () => props.modelValue,
@ -310,7 +310,6 @@ async function updateLineStyle(animation: boolean = true) {
if (!state.inited) return if (!state.inited) return
const { autoLineWidth, lineWidth, lineHeight } = props const { autoLineWidth, lineWidth, lineHeight } = props
try { try {
const rects = await getRect($item, true, proxy)
const lineStyle: CSSProperties = {} const lineStyle: CSSProperties = {}
if (isDef(lineWidth)) { if (isDef(lineWidth)) {
lineStyle.width = addUnit(lineWidth) lineStyle.width = addUnit(lineWidth)
@ -325,12 +324,13 @@ async function updateLineStyle(animation: boolean = true) {
lineStyle.height = addUnit(lineHeight) lineStyle.height = addUnit(lineHeight)
lineStyle.borderRadius = `calc(${addUnit(lineHeight)} / 2)` lineStyle.borderRadius = `calc(${addUnit(lineHeight)} / 2)`
} }
const rects = await getRect($item, true, proxy)
const rect = rects[state.activeIndex] const rect = rects[state.activeIndex]
let left = rects.slice(0, state.activeIndex).reduce((prev, curr) => prev + Number(curr.width), 0) + Number(rect.width) / 2 let left = rects.slice(0, state.activeIndex).reduce((prev, curr) => prev + Number(curr.width), 0) + Number(rect.width) / 2
if (left) { if (left) {
lineStyle.transform = `translateX(${left}px) translateX(-50%)` lineStyle.transform = `translateX(${left}px) translateX(-50%)`
if (animation) { if (animation) {
lineStyle.transition = 'width 300ms ease, transform 300ms ease' lineStyle.transition = 'width 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);'
} }
state.useInnerLine = false state.useInnerLine = false
state.lineStyle = objToStyle(lineStyle) state.lineStyle = objToStyle(lineStyle)