Am I working correctly with components in vue?

Question

Vue.js

Hey!
I need expert advice, please tell me if I'm doing the right thing, because just learning, this is my first project on vue (backend - laravel). There is a task: to display an article and comments to it. I singled out 2 components (article, comments). I pass the article through props.

export default {
        props: [
            'news'
        ]
    }

Decided to receive comments through axios. Tell me, please, and here - which is more correct: to receive comments in the same way as the article on the back and pass through props, or send a get request and receive comments when mounting? I went the second way, but I'm not sure if it's correct. It came out like this:

export default {
        data : {
            comments : null
        },
        mounted() {
          this.update();
        },
        methods: {
            'update' : function() {
                axios.get('/news/getCommentsList').then( (response => {
                    console.log(response.data);
                    this.comments = response.data;
                }) )
            }
        }
    }

Now the question arose - I need to specify news_id in this get request (to get comments), i.e. for which news get comments? But I passed news through props to another component. Is there a way to extract this variable from there? And in general, am I doing it right, or can all this be done much easier and more logically?
Many thanks in advance for your input!

Answer 1

Well, you asked for an article, didn't you? save the article id and use it when requesting comments.
but in general, in a correct way, the id of the article should be in the url line
and then drag this id through the methods of the router

methods: {
  getNewsComments() {
    const newsId = this.$route.params.id
    
    axios.get(`/news/${newsId}/comments`).then(...)
  }
}