1

In my vuejs3/bootstrap 4.3.1 app using "mitt": "^2.1.0" I have page with items and child component which triggeres event listingHeaderRightButtonClickedEvent when operator clicks on button of this child component :

  export default {

    setup () {
      function triggerListingHeaderRightButtonClickedEvent () {
        console.log('SOURCE triggerListingHeaderRightButtonClickedEvent parentComponentKey::')
        console.log(parentComponentKey)  // IN BROWSER'S CONSOLE I SEE THIS OUTPUT
        emitter.emit('listingHeaderRightButtonClickedEvent', { parentComponentKey: this.parentComponentKey })
      }

In the parent page I try to catch this event :

  const emitter = mitt()

  export default {
    setup () {
      emitter.on('listingHeaderRightButtonClickedEvent', params => {
        console.log('TARGET listingHeaderRightButtonClickedEvent params::')
        console.log(params) // IN BROWSER'S CONSOLE THIS EVENT IS NOT TRIGGERED
        if (params.parentComponentKey === 'category') {
          console.log('!!!!!loadCategories::')
          loadCategories()
        }
      })
      console.log('adminCategoriesListInit emitter::')
      console.log(emitter)

Outputting emmiter object I see : https://i.stack.imgur.com/oHK7B.jpg What is wrong ?

Thanks!

mstdmstd
  • 2,195
  • 17
  • 63
  • 140

0 Answers0