Cannot copy props to data in child component in Vue

Question

I have a child component SecondPage.vue. Props are passed to this component from parent component. Props are passed to child on click event. Then I'm trying to copy these props to data in SecondPage.vue. But when I use vue devtools, I can see, that data in child component is clear.

According to devtools, after click props in child are provided, but data (genQ, isA) is empty. Where is the mistake?

SecondPage.vue

export default {
    name: "SecondPage",
    props: ["generalQuestInfo", "isActive", "getIconClass"],
    data: function(){
        return {
            genQ: Object.assign({}, this.generalQuestInfo), //empty in devtools
            isA: this.isActive  //empty in devtools
        }
    }       
}

It's hard to understand what you want. What is the purpose of assigning props to data? Why don't you use props directly? — Daniyal Lukmanov
that's because I need component SecondPage to be displayed on routed page, but when I click that page, props are cleared. And now I'm trying to save these props to data in child component and use it instead props. And I hope this could help. stackoverflow.com/questions/57240303/… — Yurii
no, I don't. I will try, thx.To be honest, I thought this could be done without using vuex) — Yurii
The code you have provided is fine, but without knowing the details of how exactly you are passing the data to the child component we can't do much to help you. Can you provide a MCVE? — Decade Moon

Yurii Yurii · Accepted Answer · 2019-08-02T09:26:37

0

votes

Vuex store solved my problem!!!

Cannot copy props to data in child component in Vue

1 Answers