如何用uniapp uview框架 再封装一个modal

<ol>
<li>
<p>在项目中新建一个components文件夹，用于存放自定义组件。</p>
</li>
<li>
<p>在components文件夹中新建一个modal文件夹，用于存放自定义modal组件。</p>
</li>
<li>
<p>在modal文件夹中新建一个modal.vue文件，用于编写modal的代码。</p>
</li>
<li>
<p>在modal.vue文件中引入uview的modal组件，并在template中使用u-modal标签。</p>
</li>
<li>
<p>在script中，使用export default暴露一个组件对象，并在其中定义props、data、methods等属性和方法。</p>
</li>
<li>
<p>在methods中，定义需要暴露给父组件的方法，例如confirm、cancel等。</p>
</li>
<li>
<p>在父组件中，使用import引入自定义modal组件，并在template中使用该组件。</p>
</li>
<li>
<p>在父组件中，使用v-model指令绑定modal的显示状态，并使用@confirm、@cancel等事件监听器调用自定义modal组件中的方法。</p>
</li>
</ol>
<p>示例代码如下：</p>
<p>// modal.vue</p>
<template>
  <u-modal :show="show" @close="onCancel" :title="title" :content="content" :show-cancel="showCancel" :cancel-text="cancelText" :show-confirm="showConfirm" :confirm-text="confirmText" @confirm="onConfirm" @cancel="onCancel" />
</template>
<script>
import { modal } from 'uview-ui';

export default {
  name: 'MyModal',
  props: {
    title: String,
    content: String,
    showCancel: Boolean,
    cancelText: String,
    showConfirm: Boolean,
    confirmText: String,
    value: Boolean
  },
  data() {
    return {
      show: false
    }
  },
  methods: {
    onConfirm() {
      this.$emit('confirm');
      this.show = false;
    },
    onCancel() {
      this.$emit('cancel');
      this.show = false;
    }
  },
  watch: {
    value(val) {
      this.show = val;
    }
  }
}
</script>
<p>// 父组件</p>
<template>
  <view>
    <my-modal v-model="showModal" :title="title" :content="content" :show-cancel="showCancel" :cancel-text="cancelText" :show-confirm="showConfirm" :confirm-text="confirmText" @confirm="onConfirm" @cancel="onCancel" />
  </view>
</template>
<script>
import MyModal from '@/components/modal/modal.vue';

export default {
  components: {
    MyModal
  },
  data() {
    return {
      showModal: false,
      title: '提示',
      content: '确定要删除吗？',
      showCancel: true,
      cancelText: '取消',
      showConfirm: true,
      confirmText: '确定'
    }
  },
  methods: {
    onConfirm() {
      console.log('confirm');
    },
    onCancel() {
      console.log('cancel');
    }
  }
}
</script