videovip.vue 1.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859
  1. <template>
  2. <view>
  3. <view class="video-box" v-if="videoItem">
  4. <video
  5. id="video-content-box"
  6. style="width: 100%;height: 420rpx;"
  7. :src="videoItem.videoUrl"
  8. >
  9. </video>
  10. </view>
  11. <view class="bg-white p20">
  12. <view class="m20">
  13. {{videoItem.title}}
  14. </view>
  15. <view class="color-text1 fs24 ml20">
  16. 播放时长:{{videoItem.totalDuration}}
  17. </view>
  18. </view>
  19. </view>
  20. </template>
  21. <script>
  22. export default {
  23. data() {
  24. return {
  25. videoItem:{},
  26. videoId:null,
  27. }
  28. },
  29. onLoad(option) {
  30. if(option.videoitem){
  31. this.videoItem=option.videoitem ? JSON.parse(option.videoitem) : {}
  32. this.videoId=this.videoItem.videoId
  33. console.log("optionqqq",this.videoItem)
  34. console.log("option111",this.videoItem.videoUrl)
  35. }
  36. console.log("option111",this.videoItem.videoUrl)
  37. },
  38. methods: {
  39. }
  40. }
  41. </script>
  42. <style lang="scss" scoped>
  43. .video-box {
  44. width: 100%;
  45. height: 420rpx;
  46. overflow: hidden;
  47. position: relative;
  48. #myVideo {
  49. width: 100%;
  50. height: 100%;
  51. }
  52. }
  53. </style>