vue3项目中每次进入都会执行的函数
时间: 2024-09-11 17:07:40 浏览: 142
在Vue 3项目中,如果你希望某个函数在每次进入某个组件时都被执行,你可以使用生命周期钩子函数`onMounted`。这个钩子会在组件被挂载后立即被调用,因此可以用来执行初始化的代码或者当组件进入页面时需要执行的任务。
例如,你可以在组件的`setup`函数中使用`onMounted`钩子:
```javascript
import { onMounted } from 'vue';
export default {
setup() {
onMounted(() => {
// 这里的代码会在组件每次挂载后执行
console.log('组件已挂载');
});
// 返回需要暴露给模板的数据和方法
return {
// ...
};
}
};
```
对于页面级别的初始化,你也可以使用`app.use`来引入全局插件,在插件中注册全局的`onMounted`钩子:
```javascript
import { createApp } from 'vue';
import App from './App.vue';
import router from './router';
import myPlugin from './myPlugin';
const app = createApp(App);
// 使用插件
app.use(myPlugin);
app.use(router).mount('#app');
```
在插件中,你可以这样注册`onMounted`钩子:
```javascript
import { onMounted } from 'vue';
export default {
install(app) {
onMounted(() => {
// 这里的代码会在每次页面进入时执行
console.log('页面已进入');
});
}
};
```
阅读全文