Access prop through Watchers in Vuejs

Asked

Viewed 99 times

1

A similar problem has been solved in this issue:

Access prop in Vuejs method

Where a prop era null for the requisition ajax of the parent component had not yet concluded; but in my case the prop is undefined even after the complete assembly of the component and data passage via ajax has been completed.

export default {
    props: ['orders'],
    filterID: null,
...
watch: {
    filterID: (value) => {
        console.log(this.orders) // undefined
    }
}
vue.js

  • @Miguel I need to apply a filter to orders in accordance with the ID so I need to capture when the field ID is amended.

  • the filter would be applied where the console.log with: this.orders.filter()...

  • @Miguel put a watcher in orders to "copy" the data to another component property but always returns it to me null even after the data is passed to the listing component.

1 answer

1


Gives a value default to that orders(I assume you’re the type array) and so when the value changes Vue, by reactivity will update the code that depends on it.

So in time of 

props: ['orders'],

uses

props: {
    orders: {
        type: Array,
        default: () => ([])
    }
}

And so you can use filters, computed or in the template directly it will be updated.

Browser other questions tagged vue.js

You are not signed in. Login or sign up in order to post.