[Vuejs]-Vue 3 – component listen to event

You can do 3 things:

1. Make a counter store with pinia to mutate the counter state from anywhere
2. Install mitt (npm install –save mitt), to emitt and receive events from anywhere and update your component on(‘productAdded’)
3. Create a ref to the CounterComponent to access directly to the component properties from the parent,

like following:

JS
const counterRef = ref()

Template
<CounterComponent ref='counterRef' />

And then in the span event handler:

counterRef.count = 1;