首页 > 解决方案 > 从 React 应用程序上的 cloudinary 获取视频数组

问题描述

我有通过 cloudinary 托管视频的 React Web 应用程序。我想知道从云库中提取随机视频或制作数组的方法?使用的数据库是 mongodb。

这是来自 VideoPlayer 组件的代码。我尝试运行时收到 React 错误 152。

export default class VideoPlayer extends React.Component {
    state = {
       randomId: ''
    };
    componentDidMount() {
       this.randomId();
    }
    randomId = () => {
       axios
           .get(inDev ? devAPI.concat("v2/getRandomId") : baseAPI.concat("v2/getRandomId"))
           .then(data => this.setState({ randomId: data }))
           .catch(err => {
               console.log(err);
               return null;
           });
    };
    render() {
return(
           <div>
               {this.state.randomId.length === 0 ? (
                   <div>Loading...</div>
               ) : (
                   <div>this.state.randomId</div>
               )}
           </div>
    )
     }
}

这是API

router.get("/v2/getRandomId", (req, res) => {

    cloudinary.search.max_results(1).execute().then(result=>{
        return res.json({
            success: true,
            data: result.resources
        });
    });
});

谢谢

标签: arraysreactjsmongodbcloudinary

解决方案


我最终创建了一个随机数生成器,然后将该变量的乘积分配给视频数组轮播的索引值,以在每次页面加载时随机播放视频。随机数生成器放置在 componentWillMount 方法中,以在每次页面加载时发生。

谢谢大家的帮助。


推荐阅读