0

I am trying to write an if and else statement using props as rules and not sure how to construct it fully correctly. In router I have this: 

{
            path: '/CardDisplay/:type',
            name: 'CardDisplay',
            props: true,
            component: () => import('./views/CardDisplay.vue')
        },
        {
            path: '/CardDisplay/find/:movie',
            name: 'CardDisplay',
            props: true,
            component: () => import('./views/CardDisplay.vue')
        },

And then I pass two props in another vue file type and movie. Depending on a call either movie or type is going to be undefined so I wanted to write if else statement that will surround api fetch and currently page looks like this:

<template>
    <div>
        <movie-cards></movie-cards>
    </div>
</template>


<script>
import MovieCards from '@/components/MovieCards';
import HomePlans from '@/components/HomePlans';

export default {
    name: 'CardDisplay',
    props:["type", "movie"],
    components: {
        MovieCards,
        HomePlans
    },
    methods: {
        getResults(props){
        if(this.movie =="undefined"){
            apiCall(isUpcoming){
                const apiType = isUpcoming ? 'upcoming' : 'top_rated';
                const url = `https://api.themoviedb.org/3/movie/${apiType}?api_key=api key&language=en-US&page=1`;
                const response = await fetch(url);
                let data = await response.json();
                if (response.ok) {
                    this.results = data.results;
                    this.error = '';
                } else {
                    this.results = [];
                    this.error = data.errors[0];
                }
            }
        }else{
             searchCall(searchTerm){
                const urls = `https://api.themoviedb.org/3/search/movie?api_key=apikey&language=en-US&query=`;
                const API_URL = `${urls}${this.searchTerm}`;
                const responses = await fetch(API_URL);
                let data = await responses.json();
                if (responses.ok) {
                    this.results = data.results;
                    this.error = '';
                } else {
                    this.results = [];
                    this.error = data.errors[0];
                }
            }
        }
        }
    },
};
</script>
<style scoped>
</style>

However, it gives me errors inside the if statement after apiCall(isUpcoming){ and it underlines the "{" saying expected ; and it wont compile.

I added getResults that surrounds everything but Im not sure whether that is even necessary.

Maivan Fildero
  • 75
  • 6
  • And the error messages are a national security level secret? You could start by writing "if" with lowercase ... – Teemu Nov 27 '19 at 12:07
  • Write both methods and when using, check for the prop – Maxwell s.c Nov 27 '19 at 12:07
  • I think it can be a typo (not sure because I haven't seen the error message), but try to change If to if (lowercase) – Damian Peralta Nov 27 '19 at 12:22
  • What is this "function declaration" supposed to actually do: `apiCall(isUpcoming){...}`? and there's another, named `searchCall` in the `else` block. Is the body part of the function puprposed to be a function expression to pass `apiCall`, or is it meant to be a function declaration (in that case it lacks the `function` operator). – Teemu Nov 27 '19 at 12:48
  • It looks like you're *declaring* `apiCall` and `searchCall` without actually calling those methods. *Declare* them in your `methods` object and then *call* them depending on your `if` clause – Ayrton Nov 27 '19 at 12:51
  • You shouldn't check for `'undefined'` that way. Checking for it should be like: `if (typeof this.movie === 'undefined')` (More on this: https://stackoverflow.com/questions/3390396/how-to-check-for-undefined-in-javascript) – muka.gergely Nov 27 '19 at 18:21

0 Answers0