解决尚品汇search中的子组件（searchselector）点击品牌信息实现切换功能

当你点击了品牌，向服务器发请求获取相应的数据进行展示，这需要在父组件中发请求，为什么呢？因为父组件中的searchParams参数是带给服务器的（如上图），子组件把你点击的品牌信息给父组件传递信息---这时我们就想到用自定义事件

那么我们给他绑定一个单击事件tradeMarkHandler()当你点击的时候需要把该品牌给捞到，所以回调函数需要传参trademark

然后在品牌的事件处理函数在trademark中接收trademark

如何写自定义事件？

首先回到父组件index.vue那里给他的子组件searchselector绑定一个自定义事件

自定义事件以@开头

第一个参数为自定义事件名称第二个参数为自定义事件的回调，然而父组件中没有

 trademark的回调，所以写个trademarkInfo

 

但是你只是绑定了你需要触发，在哪里触发呢？我们知道，在它的子组件 （searchselector）里面

所以在品牌的事件处理函数里面写this.$emit("trademarkInfo",trademark);-------第一个参数为事件的类型trademarkInfo，第二个参数为带的值（带谁过去）trademark

一定要注意是子组件给父组件传递数据所以用$emit，所以子组件searchselector绑定一个自定义事件得用@，相当于给父亲的回调里面注入了品牌的信息，所以在自定义事件回调函数里面接收一下

如下图，可以看到这里点击的时候是可以拿到父组件可以拿到品牌的信息

 这里父组件已经拿到数据了，那么接下来就得整理参数了

然后带得再次发请求（获取search模块的数据进行展示）要不然点击底部品牌手机展示就不会有反应，但是问题又来了，就是面包屑没有展示，也就是说你需要把searchParams的trademark字段也要在面包屑那里进行展示，所以还得来个面包屑

 

 判断trademark里面有没有东西，如果有就展示，这里我们注意到trademark里面存了两个字段id和名字，这里我们只是需要名字，所以得把这个字符串切割，否则的话就会在面包屑中出现id+name

 所以得切割数组，怎么切，用：切，数组的第几项，第一项，但是你点不了你得个他绑定一个单击事件如上removeTrademark，method里面写上对应的方法

 置空和然后再次发请求回到默认页面，到这里整个流程就完毕了