Vue组合式API生命周期插入组件的实现方法？-灵析社区
古典研发君 如上图，我编写了一个 `.ts` 文件，当我在别的组件引入的时候，可以正确在组件的挂载后执行，这种思想设计是如何实现的呢？ （感觉有点类似于函数编程里的 pipe 和 compose，但是由于是一个初学者，还并不能理解 vue 这样的思想） 我期望得到的解释：该如何写一个 demo 级别的小例子去模仿实现这样的结果呢？（并不是指写出一个生命周期函数的完整过程，而是希望可以通过简单的 js 去模仿实现它）
我爱了你呢useTest.js ：
import { onMounted } from 'vue';
export function useTest() {
onMounted(() => {
console.log('组件挂载后的 onMounted 钩子被调用');
});
}
另一个 Vue 组件里引入：
// MyComponent.vue
import { useTest } from './useTest';
export default {
setup() {
useTest();
// 其他 setup 逻辑...
},
};
JS 来模拟：
// 模拟 Vue 的 onMounted 钩子
function onMounted(callback) {
// 模拟 Vue 的挂载过程
document.addEventListener('DOMContentLoaded', callback);
}
// 自定义组合函数
function useTest() {
onMounted(() => {
console.log('模拟的 onMounted 钩子被调用');
});
}
// 在模拟的组件挂载时调用 useTest
useTest();