Компонент категории делает вызов API на созданном

Question

В настоящее время мой компонент категории делает вызов HTTP API для его создания.

Поэтому, когда я перехожу из своего индекса в категорию, результат http-вызова эффективен.

Но теперь, когда я меняю категорию, я иду из localhost:8080/category/1 в localhost:8080/category/2 Мой компонент не перерисовывается, поэтому он не создается снова, и моя функция http-вызова не запускается снова, как мне бы хотелось.

    async created() {
        try {
            console.log(this.id);
            const response = await axios.get(`/api/category/getOne.php?id=${this.id}`, axiosConfig);
            console.log(response.data.records[0].name);
            this.category = [response.data.records[0].name];

        } catch (e) {
            this.errors.push(e);
            console.log(this.errors);
        }
    } 

Что вы, ребята, предлагаете для меня, я должен сделать этот http-звонок не в created () но например в methods {} а затем обнаружить изменение URL-адреса и выполнить эту функцию при каждом изменении? Или есть какой-то лучший, лучший подход для этого?

Answer 1

Я перешел над кодом в methods {} и позвони на created() и на id меняются так:

created() {
    this.getData(this.id);
},
watch: {
    '$route.params.id'(newId, oldId) {
        this.getData(newId);
    }
}

как @Belmin Bedak предложил в разделе комментариев.