在 Vue2 中，我们可以创建一个名为 Message.vue 的组件文件，然后在该文件中封装一个名为 this.$message 的方法。以下是一个简单的示例：

1. 首先，创建一个名为 Message.vue 的文件：

<template>
  <div class="message" v-if="visible">
    {{ message }}
  </div>
</template>

<script>
export default {
  props: {
    message: String,
    type: {
      type: String,
      default: 'success',
      validator: function (value) {
        return ['success', 'warning', 'info', 'error'].indexOf(value) !== -1;
      },
    },
  },
  data() {
    return {
      visible: true,
    };
  },
};
</script>

<style scoped>
.message {
  position: fixed;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
}
</style>

2. 然后，在需要使用该组件的页面中，引入并注册 Message.vue,并使用 this.$message 方法显示消息：

<template>
  <div id="app">
    <button @click="showMessage">显示消息</button>
  </div>
</template>

<script>
import Message from './components/Message.vue';

export default {
  components: {
    'message': Message,
  },
  methods: {
    showMessage() {
      const messageInstance = this.$message({ message: '这是一条消息', type: 'success' });
      const closeButton = document.createElement('button');
      closeButton.innerText = '关闭';
      closeButton.addEventListener('click', function handleClose() {
        messageInstance.close();
      });
      const container = document.createElement('div');
      container.appendChild(closeButton);
      container.classList.add('message-container');
      document.body.appendChild(container);
    },
  },
};
</script>

这样，当用户点击 "显示消息" 按钮时，就会弹出一个包含消息内容的消息框。点击 "关闭" 标签或右上角的关闭按钮可以关闭消息框。