商品筛选多重筛选过滤

效果图

 

 代码部分(附注释)

<template>
  <div class="recipe">
    <!-- v-model="activeName" -->
    <!-- 菜谱分类 start -->
    <el-tabs type="border-card" v-model="classifyName">
      <el-tab-pane
        v-for="item in classify"
        :key="item.parent_type"
        :label="item.parent_name"
        :name="item.parent_type"
      >
        <div class="recipe-link">
          <router-link
            :to="{ query: { ...$route.query, classify: option.type } }"
            v-for="option in item.list"
            :key="option.type"
            :class="{ active: classifyType === option.type }"
          >
            {
  { option.name }}
          </router-link>
        </div>
      </el-tab-pane>
    </el-tabs>
    <!-- 菜谱分类 end -->
    <h2>家常好味道&#x