réagir compter les propriétés de l'objet dans un tableau

Je suis de l'extraction de données par une API. C'est un film, une émission tv, une personne de la base de données. Quand je fais une recherche d'un mot dans la zone de recherche, il renvoie le film, émission de télévision et des noms de personne dans les objets imbriqués dans un tableau. par exemple quand je fais une recherche de "la lutte":

    [
    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",…}
   ]

il y a plus de résultats, mais je les coupe. Comme vous pouvez le voir il y a media_type propriétés de chaque objet. il existe 3 types de médias comme vous pouvez le comprendre (cinéma, de la télévision, de la personne). Je veux compter chaque type.

en fait, je veux la même chose dans le lien, je suppose: Réagir: la Syntaxe pour appeler setState l'Interrupteur de Retour

mais il ne fonctionne pas pour moi. J'ai essayé de changer simplement l'état de movieCount à 3 comme ceci: 

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

mais il ne fonctionne pas trop.et j'ai fait des recherches sur internet, ce genre de choses en javascript documentation et les forums. pas seulement réagir. mais je ne pouvais rien faire. Je sais que c'est simple.

alors, comment puis-je compter les objets dans un tableau en fonction de leurs types de propriété?

InformationsquelleAutor escalepion | 2017-06-21
  1. 3

    En supposant que les données récupérées à partir de l'API est stocké dans data variable, vous pouvez essayer le code suivant pour déterminer le nombre de movie type de support dans votre tableau de données:

    const movies = data.filter(item => item.media_type === 'movie')),
  moviesCount = movies.length;

    Vous pouvez également calculer dynamiquement le comte de chaque media_type dans votre tableau de données:

    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
    }));

    Puis counts sera quelque chose comme ceci:

    [
  {
    "type": "tv",
    "count": 3
  },
  {
    "type": "movie",
    "count": 3
  }
]
    • dans ce code, les données paramater mes films de tableau? afin de ne pas j'ai besoin d'une carte de fonction?
    • Oui, data est le tableau qui vous avez posté la question. J'ai édité la réponse.
    • merci homme. je viens de le résoudre comme: const countTypes = ce.accessoires de jeu.les films.filtre(film => film.media_type === type); const movieCounted = countTypes.longueur;
    InformationsquelleAutor poohitan
  2. 0
    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 }
    InformationsquelleAutor manas
  3. 0

    ok j'ai trouvé la solition. merci à poohitan pour la réponse. je l'ai résolu
    grâce à sa réponse. 

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

    et alors que je suis rendu à ma tv résultats, je viens d'appeler la méthode ci-dessus avec le type. par exemple: 

    return ( 
    <div> 
      movie count: {this.countType('movie')} 
      tv show count: {this.countType('tv')} 
    </div> 
    );
    • Il brise une fois les accessoires mis à jour. "cette.accessoires de jeu.les films.le filtre n'est pas une fonction". Une idée de comment la contourner ?
    • Comment avez-vous exactement à l'appel de la fonction? Il semble que vous manquez de liaison ou vous ne passez pas les accessoires correctement. (Peut-être écrit accessoires nom erroné)
    InformationsquelleAutor escalepion