this.$prompt 禁止点击遮罩时关闭弹窗

`this.$prompt` 是 `Element UI` 提供的弹窗组件，它默认情况下点击遮罩层时会关闭弹窗。如果您想禁止这种行为，可以给 `this.$prompt` 传入一个 `closeOnClickModal` 的选项，并将其设置为 `false`。

例如：

this.$prompt('请输入名称', '提示', {
  confirmButtonText: '确定',
  cancelButtonText: '取消',
  closeOnClickModal: false // 禁止点击遮罩时关闭弹窗
}).then(({ value }) => {
  console.log('输入的名称为：', value);
}).catch(() => {
  console.log('取消输入');
});

在上面的示例中，当用户单击遮罩层时，弹窗不会关闭，用户必须点击“取消”或“确定”按钮才能关闭弹窗。

相关问题

vue3 使用 this.$prompt

Vue3中使用`this.$prompt`需要先引入`ElMessageBox`组件，然后在组件中使用`this.$prompt`方法。该方法可以弹出一个带有输入框的提示框，用户可以在输入框中输入内容，然后点击确定或取消按钮。具体用法如下：

import { ElMessageBox } from 'element-plus';

ElMessageBox.prompt('请输入内容', '提示', {
  confirmButtonText: '确定',
  cancelButtonText: '取消',
  inputPattern: /\S/,
  inputErrorMessage: '内容不能为空',
  inputValidator: (value) => {
    if (!value) {
      return '内容不能为空';
    }
  },
}).then(({ value }) => {
  console.log('输入框的值', value);
}).catch(() => {
  console.log('取消');
});

其中，第一个参数为提示框中显示的文本内容，第二个参数为提示框的标题，第三个参数为配置项，可以设置确定和取消按钮的文本、输入框的验证规则等。`then`方法中的回调函数会在用户点击确定按钮后执行，可以获取用户在输入框中输入的内容。`catch`方法中的回调函数会在用户点击取消按钮后执行。

this.$prompt 增加必填标识

如果你使用的是 ElementUI，可以在 `$prompt` 方法中添加 `inputAttributes` 属性来设置输入框的属性，其中包括 `required` 属性来标识输入框为必填项。例如：

this.$prompt('请输入姓名', '提示', {
  inputAttributes: {
    required: true
  }
}).then(({ value }) => {
  // 处理输入的值
}).catch(() => {
  // 取消操作
});

如果你使用的是其他 UI 库或自己封装的弹窗组件，可以参考相应的文档来设置输入框的属性。