I made this simple application. There is a homepage where i print movies with an API, and if I click the movie it opens a page with the selected movie info. In the info page I made another Api call. I customized the url so when you click on more info, it returns the id of the object that contains the movie's info. So I made a function that takes the id from the url and confronts it with the one of the call API. if they match, the function returns true. But how am i supposed to get and print the movie info with this data? What would you do? Here is the code:

<template>
    <div>
        <div v-for="info in movieInfo"
            :key="info.id">

            {{info.id}}
        </div>
    </div>
</template>

<script>
import axios from 'axios'

    export default {
        name: 'ViewComp',
        data() {
            return{
                movieInfo: [],
            }
        },
        mounted () {
            axios
                .get('https://api.themoviedb.org/3/movie/popular?api_key=###&language=it-IT&page=1&include_adult=false&region=IT')
                .then(response => {
                    this.movieInfo = response.data.results
                    // console.log(response.data.results)
                })
                .catch(error => {
                    console.log(error)
                    this.errored = true
                })
                .finally(() => this.loading = false)
        },
        methods: {
            confrontID(){
                var url = window.location.href;
                var idUrl = url.substring(url.lastIndexOf('/')   1);
                var idMovie = this.info.id;

                if (idUrl === idMovie) {
                    return true;
                }
            }
        }
        

    }

    
</script>

<style scoped lang="scss">
/*Inserire style componente*/
</style>

CodePudding user response：

You can get rid of the "return true" on as it will return true if they match. Then instead return the movie info associated with the idUrl

if (idUrl === idMovie) {
   return idUrl;
 }

Then use that to reference the movie