语法糖中使用promise

Question

<template>
<h1>{{result}}</h1>
</template>
<script setup lang="ts">
import { defineExpose } from 'vue';
  const val = () =>{
    return new Promise((resolve)=>{
      setTimeout(() => {
        return resolve({
          result:45
        })
      }, 3000);
    })
  }
</script>

老师你好，我想问一下setup语法糖中如何能够在模板中使用result，目前这个代码中在模块使用插值表达式包裹result会显示错误、

类型“{ $: ComponentInternalInstance; $data: {}; $props: Partial<{}> & Omit<Readonly<ExtractPropTypes<{}>> & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>; ... 10 more ...; $watch(source: string | Function, cb: Function, options?: WatchOptions<...> | undefined): WatchStopHandle; } & Readonly<...> & Sha...”上不存在属性“result”。ts(2339)
没有可用的快速修复

这里是鼠标放到result上显示的错误

Answer 1

张轩 2022-05-25 09:59:38

同学你好

据我所知，这个问题是插件的问题，目前还没发解决，由于他的特殊写法，造成没发正确推论到 result 以及 result 的类型，但是运行还是没问题的，这个和 setup 语法糖也没有关系，即使使用普通的 setup 也会报错的。

• 提问者 Ryus #1

  谢谢老师。项目中的那个ColumnList.vue组件中computed计算属性中也出现了同样的问题，我把插件换成volar就好了