uv-preview-video.vue 789 B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. <template>
  2. <uv-popup ref="popup" @change="change">
  3. <view class="video-view" v-if="show">
  4. <video class="video" :src="getSec" :autoplay="autoplay"></video>
  5. </view>
  6. </uv-popup>
  7. </template>
  8. <script>
  9. export default {
  10. props: {
  11. src: {
  12. type: String,
  13. default: ''
  14. },
  15. autoplay: {
  16. type: Boolean,
  17. default: true
  18. }
  19. },
  20. data() {
  21. return {
  22. videoSrc: '',
  23. show: false
  24. }
  25. },
  26. computed: {
  27. getSec() {
  28. return this.src || this.videoSrc;
  29. }
  30. },
  31. methods: {
  32. open(url) {
  33. this.videoSrc = url;
  34. this.$refs.popup.open();
  35. },
  36. close() {
  37. this.$refs.popup.close();
  38. },
  39. change(e) {
  40. this.show = e.show;
  41. }
  42. }
  43. }
  44. </script>
  45. <style scoped lang="scss">
  46. .video-view {
  47. width: 750rpx;
  48. .video {
  49. width: 750rpx;
  50. }
  51. }
  52. </style>