uni-popup-dialog自定义上传

您可以使用 `uni-popup-dialog` 组件来自定义上传功能。下面是一个示例代码，展示了如何使用 `uni-popup-dialog` 实现自定义上传功能：

<template>
  <view>
    <uni-popup-dialog
      ref="popup"
      :show="showPopup"
      :title="popupTitle"
      :buttons="popupButtons"
      :content="popupContent"
      @buttonclick="onPopupButtonClick"
    ></uni-popup-dialog>
    <button @click="showUploadDialog">打开上传对话框</button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      showPopup: false,
      popupTitle: '上传文件',
      popupButtons: [
        {
          text: '取消',
          type: 'default',
          value: 'cancel'
        },
        {
          text: '确定',
          type: 'primary',
          value: 'confirm'
        }
      ],
      popupContent: '',
    };
  },
  methods: {
    showUploadDialog() {
      this.showPopup = true;
      this.popupContent = '<input type="file" accept="image/*" @change="onFileChange">';
    },
    onFileChange(event) {
      // 处理文件上传逻辑
      const file = event.target.files[0];
      console.log('上传文件:', file);
    },
    onPopupButtonClick(value) {
      if (value === 'cancel') {
        this.showPopup = false;
      } else if (value === 'confirm') {
        // 执行确定按钮的逻辑
        this.showPopup = false;
      }
    },
  },
};
</script>

在上述示例中，我们使用了 `uni-popup-dialog` 组件来创建一个自定义的上传对话框。当点击 "打开上传对话框" 按钮时，会弹出一个对话框，其中包含一个文件选择框。选择文件后，会触发 `onFileChange` 方法，您可以在该方法中处理文件上传的逻辑。

请注意，上述示例中使用的是 `uni-popup-dialog` 组件，这是基于uni-app框架的一个组件。如果您使用的是其他框架，可以根据对应框架的弹窗组件进行相应的替换。同时，您还需要根据您的具体需求进行适当的修改和调整。