Issue Description
vue 3 中使用 tsx 编写 defineComponent 时发现2个关联性较强问题
- tsx代码段中，补全时不符合实际语法（算小问题）
- 光标指入某个虚拟dom或真dom，整段tsx的class纯文本被显示为空，光标显示位置也不符合实际位置
Steps to Reproduce
- 样例代码 (vue 3 + ts) 下的tsx方法，尝试引导NES去补全 props.title 行的下一行 message 行
const Wrapper = defineComponent({
name: 'ContentWrapWrapper',
props: {
title: { type: String, default: '' },
message: { type: String, default: '' },
noBorder: { type: Boolean, default: false }
},
setup(props, { slots }) {
return () => (
<>
{props.title ? (
<div class="flex items-center">
<span class="text-16px font-700">{props.title}</span>
<!-- 【【在这里引导补全 props.message】】 -->
{props.message ? (
<ElTooltip effect="dark" placement="right" class="ml-5px ">
{{
content: () => <div class="max-w-200px">{props.message}</div>,
default: () => <Icon size={14} class="ml-5px" icon="ep:question-filled" />
}}
</ElTooltip>
) : null}
<div class="flex flex-grow pl-20px">{slots.header?.()}</div>
</div>
) : null}
{slots.default?.()}
</>
)
}
})
- 在非tsx代码段操作，并进入tsx代码段时，复现问题1（算小问题）
- 编辑部分 props.message 行代码，等待NES，复现问题2
问题1 - 补全时不符合实际语法(举个例子)
预期 - 正常的tsx语法:
<div class={`flex items-center ${props.noBorder ? 'transparent-header' : ''}`}>
实际 - 模版语法(大致如此，每次略有区别):
<div :class=['flex items-center', {'transparent-header' : props.noBorder }]>
问题2 - 整段tsx的class纯文本被显示为空，光标显示位置也不符合实际位置
预期 - 正常的NES交互，光标位置也正常:
实际:
如图，class相关内容都被显示清空(实际还在)；尝试光标指向被提示行(红色行)有错位情况
如果接受NES，显示就恢复正常
Operating System
windows 11
Current Qoder Version (Menu → About Qoder → Copy)
Version: 0.2.25
VSCode Version: 1.100.0 (user setup)
Commit: b26f78c1b8cef211b4a811fc937798e26d850a51
Date: 2025-12-26T04:26:55.607Z
Electron: 37.7.0
Chromium: 138.0.7204.251
Node.js: 22.20.0
V8: 13.8.258.32-electron.0
OS: Windows_NT x64 10.0.26100
