关于vuedefineexpose的信息

本篇文章给大家谈谈vuedefineexpose，以及对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

本文目录一览：

• 1、vue3.2中的defineProps、defineEmits、defineExpose
• 2、解决：使用 Vue 3 Script Setup 时 ESLint 报错 ‘defineProps‘ is not defined
• 3、vue3组件传值方式
• 4、「 VUE3 + TS + Vite 」父子组件间如何通信？
• 5、getCurrentInstance在vue3中遇到的问题

vue3.2中的defineProps、defineEmits、defineExpose

获取组件传值

子组件向父组件事件传递

子组件暴露自己的属性

父组游逗件获信仔取属性

点赞加关注，永远不迷路滑磨汪

解决：使用 Vue 3 Script Setup 时 ESLint 报错 ‘defineProps‘ is not defined

Vue 3 的 Script Setup 语法引入了 defineProps、defineEmits、defineExpose、withDefaults 的编译器宏。然而某些情握唤况下，ESLint 会报错以上编译器宏函数未定义。

本文将介绍或皮告两种解决方案来解决这个问题（假定你的项目使用 Vue-Cli 进行衫明初始化）。

若版本在 v8.0.0 以上，跳转到 Step 2，否则直接到 Step 3 的内容。

打开 .eslintrc.js 文件并修改如下：

打开 .eslintrc.js 文件并修改如下：

[img]

vue3组件传值方式

适用于层级比较多，如笑段爷孙组件传值。结合传函数的方式，可以让爷孙组件相互传值

用 provide 和键升老 inject 会遇上类型问题，子组件接收到的是unknown类型

所以用 InjectionKey 类型声明来定义值（做名称）

之前的文章有独立介绍

v-model相当于传递了 modelValue ，并接收抛出的 update:modelValue 事件

父组件是不稿升能直接访问子组件的方法。需要子组件手动的抛出：defineExpose()

「 VUE3 + TS + Vite 」父子组件间如何通信？

组件之间传值，大家都很熟悉，涉及到 VUE3 +TS 好多同学就无从下手了，所以分享这篇文章，希望看完后提起 VUE3+TS 能够不慌不忙。

平时使用的函数如：ref、reactive、watch、computed 等需要先引入才能使用，但是本篇文章介绍的 defineProps、withDefaults、defineEmits、defineExpose 都是开箱即用的函数，无需引入。

在父组件内给子组件传值时，通过 v-bind 绑定一个数据，然后子组件使用 defineProps 接收数据。

可以传递的数据有两种：字符串类型 和 非字符串类型丛销岁。字符串类型不需要 v-bind，非字符串需要使用 v-bind，可以简写成冒号（:）。

子组件接收的时候使用 defineProps，需要注意的是我们使用 TS 需要加类型限制，如果不是 TS 的可以直接使用。

TS 语法使用：

非 TS 语法使用：

对应上边父组件传值，使用 TS 语法接收的子组件代码为：

在非 TS 语法中，default 可以设置默认值，在 TS 语法中，如何设置默认值呢？

withDefaults 是一个无渗睁需引入开箱即用的函数，可以接收两个参数，第一个用于defineProps 接收参数，第二个参数是一个对象用于设置默认值。

使用方式1：分离模式

使用方式2：组合模式

给上边的子组件添加默认值代码如下：

将父组件中传的值删除掉之后，发现设置的默认值就展示出来了。

子组件给父组件进行传值时，都斗大是通过派发事件，去触发父组件中的事件并接收值。

在子组件绑定一个 @click 事件，然后通过 defineEmits 注册自定义事件，当点击 @click 事件时触发 emit 去调用注册事件，然后传递参数。

如果是多个自定义事件，写法如下：

我们在子组件内，使用 defineEmits 添加派发事件：

父组件内使用自定义事件，接收子组件传递来的数据：

子组件向父组件传值时，除了使用 defineEmits 之后，也可以使用 defineExpose ，它是通过把组件自己的属性暴露出去，父组件先获取到子组件，再获取属性值。

defineExpose 接收一个对象参数，包含需要传递的属性。

在子组件内，定义和暴露需要传递的属性：

在父组件内使用 ref 获取到子组件，然后打印属性：

getCurrentInstance在vue3中遇到的问题

在项目升级中碰到的问题

两激余个组件都是script setup写法

A在明告滚通过$refs调用B的openPicker的方法，

B组件中的写法

openPicker是友隐通过defineExpose暴露出去的

ps：setup里面定义的方法和变量都是不会暴露出去的，想通过组件引用来使用就必须要用defineExpose

解决方法

const { proxy } = getCurrentInstance(); 不能写在openPicker里面，把它移出来就行了

关于vuedefineexpose和的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。