单独页面上Vue.js组件之间的通信

我是Vue.js的初学者，我有一个问题与不在同一页面上的Vue.js组件之间的通信有关
我的Vue.js应用程序中有多个页面，我使用路由器在它们之间导航。因此，我有过滤实体的“主页”和“搜索”页面
在“主页”上，我也有不太详细的搜索组件，我想将其用作“搜索”页面的快捷方式，因此当用户填写输入字段并单击按钮时，他的搜索参数将传递到“搜索”页面上的搜索组件，并显示“搜索”页面，然后执行搜索。基本上，我只想将数据从“主页”上的快捷搜索组件发送到“搜索”页面上的搜索组件。 我尝试使用事件总线，当在“主页”上单击按钮时，我会从“主页”页面搜索中发出参数：

methods:{
        searchApartments: function(){
            
            this.searchParameters.push(this.locationSearch);
            this.searchParameters.push(this.$refs.guestNumberInput.value);
            
            this.$root.$emit("searchApartmentsFromHomepage", this.searchParameters);        
            this.$root.$emit("showAppartmentPage");
        }

在“搜索”页面的搜索组件上，我使用了挂载的“生命周期挂钩”（）来监听该事件总线。然后，我将将“搜索”页面组件上的字段设置为从“主页”获取的值（这些字段通过“v-model”绑定到“数据”中的字段）。然后，我将使用以下值调用搜索函数：

    mounted(){
        this.$root.$on("searchApartmentsFromHomepage", (searchParameters) => {
            this.locationSearch = searchParameters[0];
            this.numberOfGuests = searchParameters[1];
            
            this.filterApartments();
        });
        
    },  

---

我做了所有的工作，但“搜索”页面上的输入字段并没有设置为我从“主页”收到的值。不幸的是，即使成功地传递了值，它们也不会出现在我的搜索组件的字段中，筛选函数也不会从中获取任何数据
有人知道我做错了什么吗？

看起来您在

搜索
页面之前发出了事件

最简单的解决方案是在重定向url中设置参数

据我所知，目前您使用重定向
/home
->
/search

使用搜索参数，它将是
/home
->
/search？param=value&…
听起来好像
search
组件实例在
home
发出
searchpartment
事件时还没有创建。你说“搜索”页面上的输入字段没有设置为我从“主页”收到的值。
，你怎么知道从“主页”收到的值呢？@Sphinx我也是这么想的。但是我对Vue.js的了解有限，所以我找不到任何不同的方法来完成它，除了将“搜索”移动到后端并在那里发送请求。。。您有什么建议或可能的解决方案吗？谢谢您的回答！我将尝试这样做，我只需要找到如何将搜索参数添加到URL，以及如何在
search
页面中提取它们…从您的评论中，看起来您已经在使用Vue路由器了。以下是页面间导航的示例。是的，我有。我现在就试试。谢谢你的回答！