应用场景

通过不同的方式进入搜索页

1通过搜索框进入搜索页,再点击搜索页中的菜单选项.

2先通过首页的菜单选项进入搜索页,再点击搜索页的搜索框

我们先通过首页的搜索框进入搜索页后应该已经有了一个参数,此时我们再点击菜单,也应该有参数,此时我们应该将两个参数合并起来,如果不进行处理,那么只会存在一个参数. 如果我们先通过菜单进入搜索页,然后再用搜索框进行搜索,那么在点击进行搜索按钮搜索之前就应该已经存在了一个参数,我们需要将已存在的参数和搜索框输入的参数进行合并.

goSearch() {
      let location = {
        name: 'search',
        params: { keyword: this.keyword || undefined },
      }
      if (this.$route.query) {
        location.query = this.$route.query
      }
      this.$router.push(location)
    },
  },

    goSearch(event) {
      let element = event.target
      let { categoryname, category1id, category2id, category3id } =
        element.dataset
      //如果标签身上有categoryname 一定是a标签
      if (categoryname) {
        let location = { name: 'search' }
        let query = { categoryName: categoryname }
        //一级分类\二级分类\三级分类
        if (category1id) {
          query.category1Id = category1id
        } else if (category2id) {
          query.category2Id = category2id
        } else if (category3id) {
          query.category3Id = category3id
        }
        // 整理参数
        if (this.$route.params) {
          location.params = this.$route.params
        }
        location.query = query
        console.log(location)
        this.$router.push(location)
      }
    },

截图