js文件里如何引用this.$message
时间: 2023-12-26 20:03:56 浏览: 37
this.$message 是 Element UI 提供的全局方法,可以在 Vue 组件中使用。如果要在一个 js 文件中使用 this.$message,需要先确保该文件已经引入了 Vue 和 Element UI,并且该文件所在的模块是 Vue 实例的一个子模块。可以通过在该子模块中挂载 $message 方法来实现在 js 文件中使用 this.$message。
例如,在 Vue 组件的 mounted 生命周期钩子中可以这样使用 this.$message:
```javascript
mounted() {
this.$message({
message: '组件已经挂载',
type: 'success'
});
}
```
如果想在其他 js 文件中使用 this.$message,可以将该方法单独封装成一个模块,然后在需要使用它的地方引入。例如:
```javascript
// message.js
import Vue from 'vue';
import { Message } from 'element-ui';
Vue.prototype.$message = Message;
// other.js
import Vue from 'vue';
import './message';
const app = new Vue({
el: '#app',
mounted() {
this.$message({
message: '组件已经挂载',
type: 'success'
});
}
});
```
这样,在 other.js 中就可以使用 this.$message 了。