[Vuejs]-How to update the details dynamically in vuejs?

by

0👍

✅

Each of your components is a separate Vue instance.
That means you can’t access the same items object using this.items in the User or HelloWorld components.

What you need to do is "raise up the state" so that both components can access the same items object.
You can either do this using a mutual parent component and props or by using a store like vuex.
Documentation for props: https://v2.vuejs.org/v2/guide/components-props.html
Documentation for vuex: https://vuex.vuejs.org/

I’ve modified your codesandbox using props:
https://codesandbox.io/s/priceless-gauss-62tqm

In a couple of words:

  • Display the values (items) passed from the parent component (or vuex) and use it as the "source of truth".
  • Emit/dispatch an event (e.g. update) passing the new data to the component.
  • Update the data in the parent component/store.

Leave a comment