Multi Video play problem

[lijunjin418]

I want to play several videos. My code is the followings. I tryied with 2 methods. Method1:(Error: client.js?06a0:84 TypeError: Cannot read property 'type' of undefined)

media:[
                {                   
                    sources:[
                        {
                            src:"",
                            type:""
                        }
                    ],
                    type:'video',
                    width:'100%',
                    height:'auto',
                    autolay: true
                }
            ]
list:[
  {url:"/....jpg", content_type:"video/mp4"}, {},{}
]

openGallery(id, ind) {
            console.log(ind)            
            this.media[0]['sources'][0]['src'] = this.list[ind]['url']
            this.media[0]['sources'][0]['type'] = this.list[ind]['content_type']
            this.$refs.lightbox.showImage(0)           
 },

Method2:(always loading only 1st video, If turning video to image, vise versa, It is working normally)

media : [  
  { 
    thumb: 'https://s3-us-west-1.amazonaws.com/powr/defaults/image-slider2.jpg',
    sources: [
      {
        src: 'https://www.w3schools.com/html/mov_bbb.mp4',
        type: 'video/mp4'
      }
    ],
    type: "video",    
    width: 800, // required
    height: 600, // required
    autoplay: true //Optional to autoplay video when lightbox opens
  },
{}, {} ....
],
openGallery(ind) {
            this.$refs.lightbox.showImage(ind)           
 },

[RafaelScharf]

I have the same problem, but my image-lightbox works normally, but generates the console log: [Vue warn]: Error in render: "TypeError: Cannot read property 'type' of undefined"

I would like to know if you can prevent this log from being generated

[RafaelScharf]

I found out what my problem was! I was setting an empty obj before having images in it and this was triggering the error on the console because the type was invalid! Adding a v-if to display the ligth-box only with the obj length greater than 0, and it worked correctly.

[arturaum]

I found out what my problem was! I was setting an empty obj before having images in it and this was triggering the error on the console because the type was invalid! Adding a v-if to display the ligth-box only with the obj length greater than 0, and it worked correctly.

Thank you, Rafael! Warnings and errors are gone!

[RafaelScharf]

I'm glad I helped you!