如图所示:先点击龙须面,再点击虾仔煎的时候,会在下拉框中按照用户的点击顺序显示出来。
问题:前端如何按照黄金糕-双皮奶-虾仔煎-龙须面的顺序显示点击的值呢?这样做的一个好处就是按后端的顺序返回给他,在后端处理节约一定的性能。同样,以该顺序显示在前端界面,增加用户的一个体验感!

回到自己的项目中,我希望实现一个这样的效果。如何现实?
 
  

起先小编也想了很多方法,数据结构的冒泡排序都用上了,后来想到了一个非常简便的方式,只需要进行一个sort简单排序即可。
  // 获取options数组
      const options = this.tooltipBaseData.options;
      // 根据options数组的下标顺序重新排序value数组中的值
      const sortedValues = value.sort((a, b) => {
        return options.indexOf(a) - options.indexOf(b);
      });
      // 更新value数组为重新排序后的值
      this.value = sortedValues;
      console.log("valie", this.value);this.tooltipBaseData.options为父组件传递给子组件的值,具体则是下拉框框的选项。
将拿到value对下拉组件进行一个v-model绑定即可。



















