vue2 只显示弹窗标题

在 Vue.js 的 2.x 版本中，如果你想要创建一个简单的弹窗组件，并只显示标题，你可以通过以下步骤来实现：

1. 首先，创建一个新的 Vue 组件，比如 `AlertTitle.vue`:

<template>
  <div class="alert">
    <h3 v-if="title">{{ title }}</h3>
  </div>
</template>

<script>
export default {
  props: {
    title: {
      type: String,
      required: true,
    },
  },
};
</script>

<style scoped>
.alert {
  /* 添加一些基本样式 */
  padding: 10px;
  border: 1px solid #ccc;
  background-color: #f9f9f9;
}
</style>

在这个组件中，我们使用了 Vue 的 `v-if` 指令来控制标题是否显示。只有当 `title` 属性存在并且非空时，标题才会显示。

2. 在父组件中使用这个组件并传入标题数据：

<template>
  <div>
    <!-- 其他内容... -->
    <AlertTitle :title="dialogTitle" />
  </div>
</template>

<script>
import AlertTitle from '@/components/AlertTitle.vue';

export default {
  components: {
    AlertTitle,
  },
  data() {
    return {
      dialogTitle: '这是一个弹窗标题',
    };
  },
};
</script>

这样，当你在父组件中更改 `dialogTitle` 的值时，对应的弹窗标题就会更新。