2 Data in 1 Row SearchFilter

[munanadhifa]

Hi,

So I have a table and in 1 table they have 2 data or 3 data in 1 row. but I don't know why i can't search the data if I make the rows like this.

memberdata: {
           img: "https://images.unsplash.com/photo-1517841905240-472988babdf9?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80",
           name: "Martha Lee",
           id: "BIT001 2208 0000005-01",
         },

for the column :

{
          label: "Member Data",
          field: "memberdata",
          filterOptions: {
            // filterFn: this.myColumnFilter,
            enabled: true, // enable filter for this column
            placeholder: "Search", // placeholder for filter input

            // trigger: "keyup", //only trigger on enter not on keyup
          },

and the template that I use to show the all data is like this:

      <span v-if="props.column.field == 'memberdata'">
                <div class="flex">
                  <img
                    class="h-11 w-11 rounded-full"
                    :src="props.row.memberdata.img"
                  />
                  <div class="grid pl-[14px]">
                    <span class="font-bold text-[#4C4F54]">{{
                      props.row.memberdata.name
                    }}</span>
                    <span class="text-[#B2B3B5] text-xs">{{
                      props.row.memberdata.id
                    }}</span>
                  </div>
                </div>
              </span>

can someone help me how to search for data in 1 row so that i can search for the member data name and ID