Arrays 在Vuejs中使用过滤器搜索json？

我想在这个json数组中基于

跟踪命令

我从服务器获得此结果，并在orders变量中设置：

   "records": [
        {
            "phone": "09********8",
            "fullName": "******",
            "records": [
                {
                    "status": "processing",
                    "details": "***",
                    "cost": "1500000",
                    "date": "۹۹/۰۳/۰۷  ۱۰:۱۴",
                    "track_order": ""
                },
                {
                    "status": "send",
                    "details": "***",
                    "cost": "2000000",
                    "date": "۹۹/۰۳/۰۷  ۱۰:۳۹",
                    "track_order": "******"
                },
                {
                    "status": "cancel",
                    "details": "******",
                    "cost": "2000000000000",
                    "date": "۹۹/۰۳/۰۷  ۱۰:۱۴",
                    "track_order": ""
                },
                {
                    "status": "proccing",
                    "details": "******",
                    "cost": "2000000000000",
                    "date": "۹۹/۰۳/۰۷  ۱۰:۱۴",
                    "track_order": ""
                }
            ]
        },
        {
            "phone": "093*******8",
            "fullName": "*******",
            "records": [
                {
                    "status": "send",
                    "details": "********",
                    "cost": "2000000000000",
                    "date": "۹۹/۰۳/۰۷  ۱۰:۴۰",
                    "track_order": "*************"
                }
            ]
        },
        {
            "phone": "09*********1",
            "fullName": "*********",
            "records": []
        }
    ]

这是我的vue.js搜索代码，我想在

getOrders

中过滤

orders

，然后返回它：

   data(){
         return {
           orders:[],
           search:""
        }
  }
  computed:{

      getOrders(){
         if(this.search){
            for(let i=0;i<this.orders.length;i++){

            return this.orders[i].records.filter(record=>{

                return this.search.toLowerCase().split(' ').every(v=>    record.track_order.toLowerCase().includes(v));
            })
        }



    }else{
        return this.orders;
    }
}
    }

data（）{
返回{
订单：[]，
搜索：“
}
}
计算：{
getOrders（）{
if（this.search）{
for（设i=0；i{
返回此.search.toLowerCase（）.split（“”）.every（v=>record.track_order.toLowerCase（）.includes（v））；
})
}
}否则{
退回此订单；
}
}
}

然后我设定

获得订单

在这样的表格中：

         <tbody v-for="(item,index) in getOrders" :key="index">
                      <tr  v-for="(record,index1) in item.records" :key="index1">
                        <td >{{item.fullName}}</td>
                        <td >{{record.details}}</td>
                        <td>{{record.cost}}</td>
                        <td  >{{record.date}}</td>
                        <td >{{record.status}}</td>
                        <td  >{{record.track_order}}</td>
     </tbody>

{{item.fullName}
{{record.details}}
{{record.cost}
{{record.date}
{{record.status}
{{record.track_order}

但它不起作用。 通过输入要搜索的单词，表不会改变 怎么了？ 你能帮我吗？

newvue({
el:“#应用程序”，
模板：`
违约
{{item.fullName}
{{record.details}}
{{record.cost}
{{record.date}
{{record.status}
{{record.track_order}
`,
数据（）{
返回{
搜索：“，
记录：[{
“电话”：“09**********8”，
“全名”：“*******”，
“记录”：[{
“状态”：“处理”，
“详情”：“***”，
“成本”：“1500000”，
“日期”：“日期/日期/日期”，
“跟踪顺序”：“aloha”
},
{
“状态”：“发送”，
“详情”：“***”，
“成本”：“2000000”，
“日期”：“日期/日期/日期”，
“跟踪顺序”：“******”
},
{
“状态”：“取消”，
“详情”：“*******”，
“成本”：“2000000000”，
“日期”：“日期/日期/日期”，
“跟踪顺序”：”
},
{
“状态”：“加工”，
“详情”：“*******”，
“成本”：“2000000000”，
“日期”：“日期/日期/日期”，
“跟踪顺序”：--”
}
]
},
{
“电话”：“093*******8”，
“全名”：“*******”，
“记录”：[{
“状态”：“发送”，
“详情”：“*******”，
“成本”：“2000000000”，
“日期”：“日期/日期/日期”，
“跟踪顺序”：“**************”
}]
},
{
“电话”：“09**********1”，
“全名”：“*******”，
“记录”：[]
}
],
};
},
计算：{
getOrders（）{
如果（！this.search）{
将此文件归还给您的记录；
}
返回此文件。getOrdersFiltered；
},
getOrdersFiltered（）{
const RECORDS=[…this.RECORDS]；
const RECORD_NEW=[]；
RECORDS.forEach（项目=>{
const RECORDS\u CHILD=item.RECORDS.filter（记录=>{
return record.track_order.toLowerCase（）.indexOf（this.search）！=-1；
});
if（记录子长度）{
item.records=记录\子项；
记录新推送（项目）
}
});
返回新记录；
},
},
方法：{
setDefault（）{
此项。search=“”；
},
},
})

newvue({
el:“#应用程序”，
模板：`
违约
{{item.fullName}
{{record.details}}
{{record.cost}
{{record.date}
{{record.status}
{{record.track_order}
`,
数据（）{
返回{
搜索：“，
记录：[{
“电话”：“09**********8”，
“全名”：“*******”，
“记录”：[{
“状态”：“处理”，
“详情”：“***”，
“成本”：“1500000”，
“日期”：“日期/日期/日期”，
“跟踪顺序”：“aloha”
},
{
“状态”：“发送”，
“详情”：“***”，
“成本”：“2000000”，
“日期”：“日期/日期/日期”，
“跟踪顺序”：“******”
},
{
“状态”：“取消”，
“详情”：“*******”，
“成本”：“2000000000”，
“日期”：“日期/日期/日期”，
“跟踪顺序”：”
},
{
“状态”：“加工”，
“详情”：“*******”，
“成本”：“2000000000”，
“日期”：“日期/日期/日期”，
“跟踪顺序”：--”
}
]
},
{
“电话”：“093*******8”，
“全名”：“*******”，
“记录”：[{
“状态”：“发送”，
“详情”：“*******”，
“成本”：“2000000000”，
“日期”：“日期/日期/日期”，
“跟踪顺序”：“**************”
}]
},
{
“电话”：“09**********1”，
“全名”：“*******”，
“记录”：[]
}
],
};
},
计算：{
getOrders（）{
如果（！this.search）{
将此文件归还给您的记录；
}
返回此文件。getOrdersFiltered；
},
getOrdersFiltered（）{
const RECORDS=[…this.RECORDS]；
const RECORD_NEW=[]；
RECORDS.forEach（项目=>{
const RECORDS\u CHILD=item.RECORDS.filter（记录=>{
return record.track_order.toLowerCase（）.indexOf（this.search）！=-1；
});
if（记录子长度）{
item.records=记录\子项；
记录新推送（项目）