Added vuex as a store and an event bus.

assets/js/pages/booklistingheader.vue

@@ -1,12 +1,12 @@
 <template>
   <div>
-    <h1 v-if="searchTerm" v-html="'Book search: '+searchTerm"></h1>
+    <h1 v-if="searchTitle" v-html="'Book search: '+searchTitle"></h1>
     <h1 v-else>Book list</h1>
   </div>
 </template>
 
 <script>
-import {EventBus} from "../event-bus";
+import {mapState} from "vuex";
 
 export default {
   name: 'BookListingHeader',
@@ -15,14 +15,8 @@ export default {
       searchTerm: null,
     }
   },
-  created() {
-    window.EventBus.$on('updateBookListingHeader', (data) => {
-      this.searchTerm = data.searchTerm;
-    });
+  computed: {
+    ...mapState('booksmodule', ['searchTitle']),
   },
-  mounted() {
-    const urlParams = new URLSearchParams(window.location.search);
-    this.searchTerm = urlParams.get('search') || "";
-  }
 }
 </script>