将 uni-popup 的type属性改为 dialog，并引入对应组件即可使用对话框 ，该组件不支持单独使用
示例
<button @click="open">打开弹窗</button>
<uni-popup ref="popup" type="dialog">
<uni-popup-dialog mode="input" message="成功消息" :duration="2000" :before-close="true" @close="close" @confirm="confirm"></uni-popup-dialog>
</uni-popup>
export default {
methods: {
open() {
this.$refs.popup.open()
},
/**
* 点击取消按钮触发
* @param {Object} done
*/
close() {
// TODO 做一些其他的事情，before-close 为true的情况下，手动执行 close 才会关闭对话框
// ...
this.$refs.popup.close()
},
/**
* 点击确认按钮触发
* @param {Object} done
* @param {Object} value
*/
confirm(value) {
// 输入框的值
console.log(value)
// TODO 做一些其他的事情，手动执行 close 才会关闭对话框
// ...
this.$refs.popup.close()
}
}
}
| 属性名 | 类型 | 默认值 | 说明 |
|---|
| type | String | success | 对话框标题主题，可选值： success/warn/info/error |
| mode | String | base | 对话框模式，可选值：base（提示对话框）/input（可输入对话框） |
| title | String | - | 对话框标题 |
| content | String | - | 对话框内容，base模式下生效 |
| confirmText [1.7.4新增] | String | - | 定义确定按钮文本 |
| cancelText [1.7.4新增] | String | - | 定义取消按钮文本 |
| maxlength [1.8.6新增] | Number | - | 限制输入框字数（当mode="input"时生效） |
| showClose [1.8.5新增] | Boolean | - | 是否显示取消按钮 |
| value | String\Number | - | 输入框值，input模式下生效 注：1.9.0之后为双向绑定,vue2通过value,vue3通过v-model绑定 |
| placeholder | String | - | 输入框提示文字，input模式下生效 |
| borderRadius | String | - | 四周圆角值（左上、右上、右下、左下） 示例："20px 20px 20px 20px" |
| before-close | Boolean | false | 是否拦截按钮事件，如为true，则不会关闭对话框，关闭需要手动执行 uni-popup 的 close 方法 |
| 事件称名 | 说明 | 返回值 |
|---|
| close | 点击dialog取消按钮触发 | - |
| confirm | 点击dialog确定按钮触发 | e={value:input模式下输入框的值} |
| 名称 | 说明 |
|---|
| default | 自定义内容，会覆盖原有的内容显示（关键) |
解决此问题的关键问题：
就在于不要使用默认的输入，要借用默认插槽进行覆盖
修改后代码如下：
<uni-popup ref="newDeviceGroupRef" type="dialog">
<uni-popup-dialog mode="input" title="新建设备组" :before-close="true" @close="dialogInputClose"
@confirm="dialogInputConfirm">
<view style="width: 100%;">
<uni-easyinput type="text" v-model="inPutValue" placeholder="请输入设备组名" />
</view>
</uni-popup-dialog>
</uni-popup>