Quiero crear un filtro donde cuando el usuario haga clic en el botón Serie, solo se mostrará la serie en el sitio web. proyecto de captura de pantalla
Movies:[ {MovieName: 'La Casa de Papel',rating: 9,type:'Series', imgPath: 'lacasadePapel.png'}, {MovieName: 'Venom (2018)',rating: 7, type:'Movie', imgPath: 'Venom.png'}, ] <div class="NavbarContainer"> <button>Movies</button> <button @click="SerieOrMovie">Series</button> <button id="FavoriteBtn">Favorites ({{amountFav}})</button> <input type="text" v-model="search" placeholder="Search.."> </div> <div class="MoviesContainer"> <div class="Movies" v-for="(movie,index) in filteredMovies" :id="index"> <img class="image_img" :src="require('../assets/MoviesMap/' + movie.imgPath)"> <div class="image_Overlay"> <button @click="addedMovie">Add to Favorites</button> <button>Watch {{movie.MovieName}}</button> </div> </div> </div>esto es lo que traté de hacer pero no funciona
computed:{ SerieOrMovie(){ return this.Movies.filter((Movies) =>{ return Movies.type.toLowerCase().match('Series') }) },No estoy seguro exactamente de qué quieres ser cómplice.
Esto le dará todas las series:
computed: { Series() { return this.Movies.filter((Movies) => Movies.type == "Series") }