uniapp 提示框带v-model

你可以通过自定义组件的方式来实现一个带有v-model的提示框，具体实现步骤如下：

1. 创建一个自定义组件，例如名为`my-popup`的组件，在组件的template中定义提示框的样式和内容，同时使用`v-show`指令来控制提示框的显示和隐藏状态。

   <template>
     <div class="popup-wrapper" v-show="visible">
       <div class="popup-content">
         <div class="popup-header">{{ title }}</div>
         <div class="popup-body">{{ message }}</div>
         <div class="popup-footer">
           <button @click="cancel">取消</button>
           <button @click="confirm">确定</button>
         </div>
       </div>
     </div>
   </template>
   
   <script>
   export default {
     props: {
       title: {
         type: String,
         default: "提示"
       },
       message: {
         type: String,
         default: ""
       },
       value: {
         type: Boolean,
         default: false
       }
     },
     data() {
       return {
         visible: this.value
       };
     },
     watch: {
       value(newValue) {
         this.visible = newValue;
       },
       visible(newValue) {
         this.$emit("input", newValue);
       }
     },
     methods: {
       cancel() {
         this.visible = false;
       },
       confirm() {
         this.visible = false;
         // 点击确定后的逻辑处理
       }
     }
   };
   </script>

在上述代码中，`visible`表示提示框的显示和隐藏状态，初始值为`props`中的`value`属性。在`watch`中监听`props`中的`value`属性和`visible`属性的变化，并通过`$emit`方法向父组件发送`input`事件来更新`v-model`的值。

2. 在使用该组件的页面中引入`my-popup`组件，并使用`v-model`来绑定提示框的显示和隐藏状态。

   <template>
     <div class="page">
       <my-popup v-model="showPopup" :title="title" :message="message"></my-popup>
     </div>
   </template>
   
   <script>
   import MyPopup from "@/components/MyPopup.vue";
   
   export default {
     components: {
       MyPopup
     },
     data() {
       return {
         showPopup: false,
         title: "提示",
         message: "确定要删除吗？"
       };
     }
   };
   </script>

在上述代码中，`showPopup`绑定了`my-popup`组件的`v-model`，通过修改`showPopup`的值来控制提示框的显示和隐藏状态。同时，通过`props`向`my-popup`组件传递提示框的标题和内容。在点击取消或确定按钮时，可以通过调用`cancel`或`confirm`方法来修改`visible`的值，从而控制提示框的隐藏。