setup 函数确实可以直接接收一个 expose 参数，通过这个参数我们可以控制哪些属性或方法暴露给父组件。这种方式在使用 <script setup> 语法时特别有用，并且它提供了一种更直接的方法来指定要暴露的内容，而不需要使用编译器宏或者生命周期钩子。
下面是一个使用 setup 函数的 expose 参数的例子：
<script setup>
import { ref } from 'vue';
// 定义内部状态和方法
const message = ref('Hello from child component!');
const greet = () => {
console.log(message.value);
};
// 内部方法，不希望暴露出去
const internalMethod = () => {
console.log('This method is not exposed');
};
// 使用 setup 的 expose 参数来明确暴露出去的属性或方法
defineExpose({
greet,
});
</script>
<template>
<div>
<p>{{ message }}</p>
</div>
</template>
在这个例子中，我们并没有显式地调用 onMounted 或者使用 $expose，而是直接在 setup 函数中通过 defineExpose 来指定哪些内容应该被暴露出去。这种方式简化了代码，并且与 <script setup> 语法非常契合。
对于不使用 <script setup> 的情况，即传统写法的单文件组件（SFC），setup 函数也可以接收第三个参数，它是一个对象，包含了 attrs、slots、emit 和 expose 等属性。你可以像下面这样使用 expose：
export default {
setup(props, { attrs, slots, emit, expose }) {
const message = ref('Hello from child component!');
const greet = () => {
console.log(message.value);
};
// 暴露方法给父组件
expose({
greet,
});
return {
// 返回给模板的内容，不会全部暴露给父组件
greet,
// ...其他返回值
};
},
};
在这个例子中，expose 是作为 setup 函数第二个参数对象的一部分传递进来的。我们通过调用 expose 并传入一个对象来定义哪些属性或方法应该暴露给父组件。这种方式适用于不使用 <script setup> 的场景，并且提供了清晰的方式去管理哪些内容应该被外部访问。
无论你选择哪种方式，使用 setup 函数的 expose 参数或 defineExpose 编译器宏都可以帮助你精确控制组件的公开接口，同时保持良好的开发体验和类型安全。