uni-popup和uni-datetime-picker一起使用bug

uni-popup和uni-datetime-picker一起使用bug

在uni-popup中使用uni-datetime-picker，时间选择器会受到弹出层影响，微信小程序打开弹出层后，不知道是因为冲突还是什么，弹出层内容无法操作

这个问题可能是由 uni-popup 和 uni-datetime-picker 两个组件冲突引起的。您可以尝试以下方法解决：

尝试将 uni-datetime-picker 组件放在 uni-popup 组件之外，看看是否还存在相同的问题。

如果必须要在 uni-popup 中使用 uni-datetime-picker，则可以尝试在 uni-popup 组件显示时，将组件隐藏，并在组件销毁时再显示。示例代码如下：

<template>
  <uni-popup :show="show" @close="show = false">
    <view slot="popup">
      <uni-datetime-picker v-if="isShowPicker" @cancel="hidePicker" @change="onChange"></uni-datetime-picker>
    </view>
  </uni-popup>
</template>
<script>
  export default {
    data() {
      return {
        show: false,
        isShowPicker: false
      };
    },
    methods: {
      showPopup() {
        this.show = true;
        this.isShowPicker = true; // 先显示组件
        setTimeout(() => {
          this.$refs.picker.showPicker(); // 显示选择器
        }, 100);
      },
      hidePicker() {
        this.isShowPicker = false;
      },
      onChange(datetime) {
        console.log(datetime);
      }
    }
  }
</script>

在该示例代码中，uni-datetime-picker 组件初始隐藏。当弹出层显示时，设置 isShowPicker 为 true 并且通过 setTimeout 方法延迟一段时间后再调用 $refs 获取组件实例，并显示选择器。当选择器销毁时，设置 isShowPicker 为 false，以保证在后续操作中不会出现相互冲突的问题。

如果上述两种方法都不能解决问题，请考虑使用其它第三方组件或自己开发组件来替代 uni-datetime-picker 和 uni-popup 组件。