Question

我正在通过API获取数据。这是一部电影，电视节目，人物数据库。当我在搜索框中搜索单词时，它会在嵌套在数组中的对象中返回相关的电影，电视节目和人名。例如，当我搜索“战斗”时：

    [
    0:{original_name: "쌈 마이웨이", id: 70813, media_type: "tv", name: "Fight My Way", vote_count: 5,…}

    1:{vote_average: 8.2, vote_count: 8057, id: 550, video: false, media_type: "movie", title: "Fight Club",…}

    2:{vote_average: 6.1, vote_count: 215, id: 345922, video: false, media_type: "movie",…}

    3:{original_name: "Fight", id: 46554, media_type: "tv", name: "Fight", vote_count: 0, vote_average: 0,…}

    4:{original_name: "The Good Fight", id: 69158, media_type: "tv", name: "The Good Fight", vote_count: 22,…}

    5:{vote_average: 0, vote_count: 0, id: 158301, video: false, media_type: "movie", title: "Fight",…}
   ]

有更多的结果，但我切了它们。如您所见，每个对象中都有media_type个属性。你可以理解有3种媒体类型（电影，电视，人）。我想计算每种类型。

实际上;我想在链接中想要相同的东西：React: Syntax for calling setState in Switch Return

但它对我不起作用。我试图将movieCount的状态改为3，如下所示：

countType() {
        this.props.movies.map(movie => {
            return() => {
            if(movie.media_type === 'movie') {
                this.setState({ movieCount: 3});
                console.log(this.state);
            }
            }
        });
    }

但它也不起作用。我在互联网上研究了javascript文档和论坛中的这些东西。不仅仅是反应。但我无能为力我知道这很简单。

那么如何根据属性类型计算数组中的对象？

Answer 1

假设您从API获取的数据存储在def resource_path(relative_path): try: base_path = sys._MEIPASS except Exception: base_path = os.path.abspath(".") return os.path.join(base_path, relative_path) os.environ['Path'] = resource_path(r'binaries') import pydub变量中，您可以尝试使用以下代码查找数据数组中data媒体类型的数量：

movie

您还可以动态计算数据数组中每个const movies = data.filter(item => item.media_type === 'movie')), moviesCount = movies.length;的计数：

media_type

然后const mediaTypes = data .map(dataItem => dataItem.media_type) // get all media types .filter((mediaType, index, array) => array.indexOf(mediaType) === index), // filter out duplicates counts = mediaTypes .map(mediaType => ({ type: mediaType, count: data.filter(item => item.media_type === mediaType).length }));将是这样的：

counts

Answer 2

var data = [
    { original_name: "쌈 마이웨이", id: 70813, media_type: "tv", name: "Fight My Way", vote_count: 5 },

    { vote_average: 8.2, vote_count: 8057, id: 550, video: false, media_type: "movie", title: "Fight Club" },

    { vote_average: 6.1, vote_count: 215, id: 345922, video: false, media_type: "movie" },

    { original_name: "Fight", id: 46554, media_type: "tv", name: "Fight", vote_count: 0, vote_average: 0 },

    { original_name: "The Good Fight", id: 69158, media_type: "tv", name: "The Good Fight", vote_count: 22 },

    { vote_average: 0, vote_count: 0, id: 158301, video: false, media_type: "movie", title: "Fight" },
]

this.types = {};

data.forEach((d) => {
    if (!this.types[d["media_type"]]) {
        this.types[d["media_type"]] = 1;
    } else {
        this.types[d["media_type"]] += 1;
    }
})

console.log(this.types);
// you will get answer { tv: 3, movie: 3 }

Answer 3

好吧，我找到了解决方案。谢谢poohitan的回答。我解决了通过他的回答。

countType(type) {
        const countTypes = this.props.movies.filter(movie => movie.media_type === type);
        return countTypes.length;
    }

当我渲染我的电视结果时，我只是用类型调用上面的方法。例如：

return ( 
    <div> 
      movie count: {this.countType('movie')} 
      tv show count: {this.countType('tv')} 
    </div> 
    );

Answer 4

这是一种可能的方法：

render()  {
    let countTypes = ' '
         return ({
             list.length > 0
                 ?
                  <span> {countTypes = (list.filter(moviesFilter => 
                  moviesFilter.type.id === this.props.typeId)).length} 
                  </span>
                :
                  <DisplayMessage message="0" />
        })
}

在数组中计算对象属性

4 个答案: