diff --git a/packages/stage-ui/src/components/gadgets/AudioSpectrum.vue b/packages/stage-ui/src/components/gadgets/AudioSpectrum.vue index dbc79eebd..0f1501a88 100644 --- a/packages/stage-ui/src/components/gadgets/AudioSpectrum.vue +++ b/packages/stage-ui/src/components/gadgets/AudioSpectrum.vue @@ -18,9 +18,7 @@ onMounted(() => { handleAnalyze() }) -watch(() => props.stream, () => { - handleAnalyze() -}) +watch(() => props.stream, handleAnalyze) function handleAnalyze() { if (!props.stream) { diff --git a/packages/stage-ui/src/components/scenarios/chat/ChatHistory.vue b/packages/stage-ui/src/components/scenarios/chat/ChatHistory.vue index 05dfd3f70..070df7e93 100644 --- a/packages/stage-ui/src/components/scenarios/chat/ChatHistory.vue +++ b/packages/stage-ui/src/components/scenarios/chat/ChatHistory.vue @@ -42,10 +42,9 @@ function scrollToBottom() { }) } -watch(() => props.messages, () => scrollToBottom(), { deep: true, flush: 'post' }) -watch(() => props.streamingMessage, () => scrollToBottom(), { deep: true, flush: 'post' }) -watch(() => props.sending, () => scrollToBottom(), { flush: 'post' }) -onMounted(() => scrollToBottom()) +watch([() => props.messages, () => props.streamingMessage], scrollToBottom, { deep: true, flush: 'post' }) +watch(() => props.sending, scrollToBottom, { flush: 'post' }) +onMounted(scrollToBottom) const streaming = computed(() => props.streamingMessage ?? { role: 'assistant', content: '', slices: [], tool_results: [] }) const showStreamingPlaceholder = computed(() => (streaming.value.slices?.length ?? 0) === 0 && !streaming.value.content) diff --git a/packages/stage-ui/src/components/scenarios/dialogs/onboarding/step-provider-configuration.vue b/packages/stage-ui/src/components/scenarios/dialogs/onboarding/step-provider-configuration.vue index c79b79a6e..3e3e6d71c 100644 --- a/packages/stage-ui/src/components/scenarios/dialogs/onboarding/step-provider-configuration.vue +++ b/packages/stage-ui/src/components/scenarios/dialogs/onboarding/step-provider-configuration.vue @@ -37,9 +37,7 @@ function initializeForm() { } // Watch for provider changes -watch(() => context.selectedProvider.value?.id, () => { - initializeForm() -}) +watch(() => context.selectedProvider.value?.id, initializeForm) // Computed properties const needsApiKey = computed(() => { diff --git a/packages/stage-ui/src/components/scenes/live2d/Canvas.vue b/packages/stage-ui/src/components/scenes/live2d/Canvas.vue index f7947a03f..921dc7ae5 100644 --- a/packages/stage-ui/src/components/scenes/live2d/Canvas.vue +++ b/packages/stage-ui/src/components/scenes/live2d/Canvas.vue @@ -65,8 +65,7 @@ function handleResize() { // The CSS styles handle the display size, so we don't need to manually set view dimensions } -watch([() => props.width, () => props.height], () => handleResize()) -watch(() => props.resolution, () => handleResize()) +watch([() => props.width, () => props.height, () => props.resolution], handleResize) onMounted(async () => containerRef.value && await initLive2DPixiStage(containerRef.value)) onUnmounted(() => pixiApp.value?.destroy()) diff --git a/packages/stage-ui/src/components/scenes/live2d/Model.vue b/packages/stage-ui/src/components/scenes/live2d/Model.vue index 1b9c4245c..96923d22f 100644 --- a/packages/stage-ui/src/components/scenes/live2d/Model.vue +++ b/packages/stage-ui/src/components/scenes/live2d/Model.vue @@ -393,7 +393,7 @@ function updateDropShadowFilter() { model.value.filters = [dropShadowFilter.value] } -watch([() => props.width, () => props.height], () => handleResize()) +watch([() => props.width, () => props.height], handleResize) watch(modelSrcRef, async () => await loadModel(), { immediate: true }) watch(dark, updateDropShadowFilter, { immediate: true }) watch([model, themeColorsHue], updateDropShadowFilter)