全局导航栏,需要有一个全局搜索功能
在main.js里vue原型中定义一个顶部搜索栏中的搜索时间与各页面联动的对象,search+路由名称为key,加载数据方法为value
导入各页面的methods中的load方法
Vue.prototype.$search = {
search部门列表: departmentListMoudle.methods.load,
search查询结果: searchResult.methods.load,
search个人办事: personalService.methods.load,
};
顶部搜索栏中:
顶部搜索栏中的搜索时间与各页面联动的事件
search() {
sessionStorage.setItem('searchText', this.inputValue);
this.$emit('changeSearch', this.inputValue);
let search = this.$search;
//meta携带title
let key = 'search' + this.$route.meta.title;
if (Object.prototype.hasOwnProperty.call(search, key)) {
search[key](this.inputValue);//从全局的$search中匹配到对应方法,进行查询
}
},