vue3报错：‘defineProps‘ is not defined，‘defineExpose‘ is not defined。

63 阅读 0 评论 42 点赞

我是靠谱客的博主轻松蜜蜂，最近开发中收集的这篇文章主要介绍vue3报错：‘defineProps‘ is not defined，‘defineExpose‘ is not defined。，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

把defineExpose暴露的语法注释掉之后还是报错：Cannot read properties of undefined (reading '__vccOpts')

原因：语法使用错误

Vue3.0 中变量必须 return 出来，template中才能使用。

错误代码如下：

<script lang="ts">
  const showModal = (data: any, val: string) => {
  console.log("data=====",data);
  visible.value = true;
  if (data) {
    console.log("编辑=====")
    uuid.value = data.bizCode;
    getData()
    title.value = "编辑";
    formState.value = data;
  } else {
    console.log("新增=====",val)
    title.value = "新增";
    uuid.value = val
    dataSource.value= []
    formState.value = {
      title: "",
      illustrate: "",
    };
  }
};
defineExpose({ showModal });
</script>

改正：而Vue3.2语法使用语法糖需要在 script 标签上加上 setup 属性，无需 return，template 才可直接使用。


<script lang="ts" setup>
  const showModal = (data: any, val: string) => {
  console.log("data=====",data);
  visible.value = true;
  if (data) {
    console.log("编辑=====")
    uuid.value = data.bizCode;
    getData()
    title.value = "编辑";
    formState.value = data;
  } else {
    console.log("新增=====",val)
    title.value = "新增";
    uuid.value = val
    dataSource.value= []
    formState.value = {
      title: "",
      illustrate: "",
    };
  }
};
defineExpose({ showModal });
</script>