javascript - Reactjs:为什么轮播根本不显示？

Question

好的，我有这个轮播。我正在使用AliceCarousel我认为逻辑是正确的，因为它只过滤带有 collection_name === "images" 的内容

但它似乎没有被渲染。我没有收到任何错误，为什么呢？这是 JSON 结构， 以防我忘记了什么。我正在尝试获取所有图像 URL 并将其放入轮播中。请帮助我，我是 Reactjs 新手。

galleryItems() {
    return (
        this.state.brands.map((brand, i) => {
            var checkImage = brand.media.length === 0 ? [] : brand.media.filter((media) => media.collection_name === "images");
            console.log('henlos',checkImage)
            checkImage.map((image, i) => (
                <div key={`key-${i}`}  className="card-img-top"><img src={image.url} /></div>
            ));
        })
    )
};

render(){
    const items = this.galleryItems();
    const responsive = {
        0: { items: 2 },
        600: { items: 2 },
        1024: { items: 2 }
    };

    return (
        <AliceCarousel 
            items = {items}
            mouseDragEnabled 
            responsive={responsive}
            buttonsDisabled={true}
            dotsDisabled={true}
        />
    )
}

Answer 1

您忘记从galleryItems返回checkImage.map:

galleryItems() {
    return (
        this.state.brands.map((brand, i) => {
            // ...
            return checkImage.map((image, i) => ( 
                <div key={`key-${i}`} className="card-img-top">...</div>
            ));
        })
    )
};