时间戳

首页 > 解决方案 > 如何从firebase随机渲染反应组件

reactjs - 如何从firebase随机渲染反应组件

问题描述

我正在做一个项目，并尝试在主页上随机显示带有来自 firebase 的数据的组件。

如何重新编码以便随机生成产品？

提前致谢！

import React from 'react'
import { render } from 'react-dom';
import './Product.css'

function Product(props) {
    console.log(props);
    return (
        <div className="Product">
            <div className="Product-description">
                <span className="Product-title">{props.title}</span>
                <span className="Product-price">${props.price}</span>
                <span className="Product-rating">
                    <p></p><p></p><p></p><p></p><p></p>
                </span>
            </div>
            <img src={props.image} />
            <button>Add to Cart</button>
        </div>
    )
}

export default Product

标签： reactjsfunctionreturnrendering

解决方案

您可以使用以下方法创建随机数；

const randomNumber = Math.floor(Math.random() * productCount);

然后，您可以作为道具发送并使用此随机数作为索引过滤您随机选择的产品。

推荐阅读