如何在vuejs中搜索嵌套的JSON数据？

<template>
  <div>
    <input type="text" v-model="searchKeyword" placeholder="输入搜索关键字">
    <ul>
      <li v-for="item in filteredData" :key="item.id">
        {{ item.name }}
      </li>
    </ul>
  </div>
</template>

<script>
import axios from 'axios';

export default {
  data() {
    return {
      jsonData: [], // 嵌套的JSON数据
      searchKeyword: '' // 搜索关键字
    };
  },
  mounted() {
    // 从后端获取JSON数据
    axios.get('/api/data')
      .then(response => {
        this.jsonData = response.data;
      })
      .catch(error => {
        console.error(error);
      });
  },
  computed: {
    filteredData() {
      // 根据搜索关键字过滤JSON数据
      return this.jsonData.filter(item => {
        // 这里可以根据实际需求定义搜索规则，例如根据名称进行搜索
        return item.name.toLowerCase().includes(this.searchKeyword.toLowerCase());
      });
    }
  }
};
</script>