index.vue 1.5KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445
  1. <template>
  2. <uni-shadow-root class="vant-dist-overlay-index"><van-transition v-if="lockScroll" :show="show" custom-class="van-overlay" :custom-style="'z-index: '+(zIndex)+'; '+(customStyle)" :duration="duration" @click.native="onClick" @touchmove.native.stop.prevent="noop">
  3. <slot></slot>
  4. </van-transition>
  5. <van-transition v-else :show="show" custom-class="van-overlay" :custom-style="'z-index: '+(zIndex)+'; '+(customStyle)" :duration="duration" @click.native="onClick">
  6. <slot></slot>
  7. </van-transition></uni-shadow-root>
  8. </template>
  9. <script>
  10. import VanTransition from '../transition/index.vue'
  11. global['__wxVueOptions'] = {components:{'van-transition': VanTransition}}
  12. global['__wxRoute'] = 'vant/dist/overlay/index'
  13. import { VantComponent } from '../common/component';
  14. VantComponent({
  15. props: {
  16. show: Boolean,
  17. customStyle: String,
  18. duration: {
  19. type: null,
  20. value: 300,
  21. },
  22. zIndex: {
  23. type: Number,
  24. value: 1,
  25. },
  26. lockScroll: {
  27. type: Boolean,
  28. value: true,
  29. },
  30. },
  31. methods: {
  32. onClick() {
  33. this.$emit('click');
  34. },
  35. // for prevent touchmove
  36. noop() { },
  37. },
  38. });
  39. export default global['__wxComponents']['vant/dist/overlay/index']
  40. </script>
  41. <style platform="mp-weixin">
  42. @import '../common/index.css';.van-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.7);background-color:var(--overlay-background-color,rgba(0,0,0,.7))}
  43. </style>