如果按钮也是一个数组JSON数组，我不知道如何创建一个过滤器来从数组中返回所需的卡片。

//brand.json  [
{
  "id": 1,
  "title": "Brand 1",
  "sort": "100",
  "code": "brand_1"
},
{
  "id": 2,
  "title": "Brand 2",
  "sort": "200",
  "code": "brand_2"
}
//items.Json
 [
{
  "type": "simple",
  "id": 1,
  "sku": "s1",
  "title": "Product 1",
  "regular_price": {
    "currency": "USD",
    "value": 27.12
  },
  "image": "/images/1.png",
  "brand": 9
  },
  Code: 
    <div class="nav">
        <span class="w-full my-4 "> All brands</span>
        <hr />
        <div class="btn" v-for="(item, id) in brand" :key="id" @click="filter">{{ item.title 
     }}</div>
    </div>

    <div class="container-fluid">
    <div class="row">
        <div class="col-lg-3" v-for="(item, id) in items" :key="id">
            <img src="./logo.png" class="rounded mx-auto d-block">
            <br> {{ item.title }} <br> brand {{ item.brand }} <br> ${{ 
           item.regular_price.value }}
            <div class="btn me-md-2" id="btn"    @click="$emit('addToCart', value)"> Add to 
           cart</div>
           </div>
        </div>
         </div>
    <script>
      import brand from '@/components/brand.json';
  import items from '@/components/items.json';
  export default {
    name: "App",
    data: () => ({
    brand,
    items,
    filteredBrand: [],
}),
} </script>