npm i react-thumbnails-video-preview
import React from "react";
import ReactVideosPreview from "react-thumbnails-video-preview";
const list = [
{
imgList: [
`https://dummyimage.com/200x200/111/fff&text=1`,
`https://dummyimage.com/200x200/111/fff&text=2`,
`https://dummyimage.com/200x200/111/fff&text=3`
]
}
];
export default function Example() {
return (
<ReactVideosPreview list={list}/>
);
}
you just need to add more elements in list array
...
const list = [
{
imgList: [
`https://dummyimage.com/200x200/111/fff&text=1`,
`https://dummyimage.com/200x200/111/fff&text=2`,
`https://dummyimage.com/200x200/111/fff&text=3`
]
},
{
imgList: [
`https://dummyimage.com/200x200/111/fff&text=4`,
`https://dummyimage.com/200x200/111/fff&text=5`,
`https://dummyimage.com/200x200/111/fff&text=6`
]
}
];
...
global way
<ReactVideosPreview
list={list}
imgError:"https://dummyimage.com/200x200/111/fff&text=error-loading"
/>
or in List object for individuals images error
...
const list = [{
...
imgError: `https://dummyimage.com/200x200/111/fff&text=error-loading`
}];
...