fix: 🐛 修复 Segmented 选项点击时无论是否改变选中值都会触发 change 的问题 (#1326)

 Closes: #1323
This commit is contained in:
不如摸鱼去 2025-09-28 19:23:40 +08:00 committed by GitHub
parent c3c6eb1249
commit 5657aa68a8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -32,7 +32,7 @@ export default {
<script setup lang="ts"> <script setup lang="ts">
import { computed, getCurrentInstance, onMounted, reactive, watch } from 'vue' import { computed, getCurrentInstance, onMounted, reactive, watch } from 'vue'
import { getRect, isObj, objToStyle, addUnit, pause } from '../common/util' import { getRect, isObj, objToStyle, addUnit, pause, isEqual } from '../common/util'
import type { CSSProperties } from 'vue' import type { CSSProperties } from 'vue'
import { segmentedProps, type SegmentedExpose, type SegmentedOption } from './types' import { segmentedProps, type SegmentedExpose, type SegmentedOption } from './types'
const $item = '.wd-segmented__item' const $item = '.wd-segmented__item'
@ -94,20 +94,29 @@ function updateActiveStyle(animation: boolean = true) {
}) })
} }
/**
* 更新值
*/
function updateValue(newValue: string | number, option: string | number | SegmentedOption) {
if (!isEqual(newValue, props.value)) {
emit('update:value', newValue)
emit('change', isObj(option) ? option : { value: newValue })
}
}
/** /**
* 更新当前下标 * 更新当前下标
*/ */
function updateCurrentIndex() { function updateCurrentIndex() {
const index = props.options.findIndex((option: string | number | SegmentedOption) => { const index = props.options.findIndex((option: string | number | SegmentedOption) => {
const value = isObj(option) ? option.value : option const value = isObj(option) ? option.value : option
return value == props.value return isEqual(value, props.value)
}) })
if (index >= 0) { if (index >= 0) {
state.activeIndex = index state.activeIndex = index
} else { } else {
const value = isObj(props.options[0]) ? props.options[0].value : props.options[0] const value = isObj(props.options[0]) ? props.options[0].value : props.options[0]
emit('update:value', value) updateValue(value, props.options[0])
emit('change', isObj(props.options[0]) ? props.options[0] : { value })
} }
} }
@ -117,10 +126,10 @@ function handleClick(option: string | number | SegmentedOption, index: number) {
return return
} }
const value = isObj(option) ? option.value : option const value = isObj(option) ? option.value : option
state.activeIndex = index state.activeIndex = index
updateActiveStyle() updateActiveStyle()
emit('update:value', value) updateValue(value, option)
emit('change', isObj(option) ? option : { value })
emit('click', isObj(option) ? option : { value }) emit('click', isObj(option) ? option : { value })
} }