@tanstack/vue-query can't unwrapRef in template
lizyChy0329 opened this issue · 0 comments
lizyChy0329 commented
Describe the bug
I tried to use codesendbox or stackblitz, but they both have problems with the type system and I could only take screenshots
When the auto-imports.d.ts exists, @tanstack/vue-query export data can't auto UnwrapRef in template
When the auto-imports.d.ts exists:
When the auto-imports.d.ts not exists:
Query setting
ImVueRef types is “const ImVueRef: globalThis.Ref<string>”
useQueryData types is "const useQueryData: Ref<any> | Ref<undefined>"
/**
* light data
*/
const ImVueRef = ref('start');
const {data: useQueryData, isPending} = useQuery({
queryKey: ['testing_light_data'],
queryFn: () =>
axios
.get('/api/lightcontent/index/getData')
.then(r => r.data)
.then(res => {
return res.data;
})
});
AutoImports Options
plugins: [
AutoImport({
include: [
/\.[tj]sx?$/, // .ts, .tsx, .js, .jsx
/\.vue$/,
/\.vue\?vue/, // .vue
/\.md$/ // .md
],
imports: [
// presets
'vue',
'vue-router',
'@vueuse/core',
{
axios: [['default', 'axios']],
dayjs: [['default', 'dayjs']],
['@tanstack/vue-query']: ['useQuery']
},
VantImports(),
],
resolvers: [VantResolver()],
vueTemplate: true,
dirs: [
'./src/js',
'./src/js/common',
'./src/js/v-component'
],
dts: './auto-imports.d.ts'
}),
Components({
resolvers: [VantResolver()]
})
],
Reproduction
no
System Info
"vue": "3.4.25",
"eslint": "^8.56.0",
"typescript": "^5.3.3",
"@vant/auto-import-resolver": "^1.2.1",
"unplugin-auto-import": "^0.17.6",
"unplugin-vue-components": "^0.27.0"
windows: 10
vscode: 1.87.2
pnpm: 8.15.6
node: 20.11.0
Used Package Manager
pnpm
Validations
- Follow our Code of Conduct
- Read the Contributing Guide.
- Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
- Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
- The provided reproduction is a minimal reproducible of the bug.