Как отфильтровать / найти таблицу элементов интерфейса с отдельной функцией JS

Question

Я строю таблицу элементов в Vue (https://element.eleme.io/#/en-US/component/table). В таблице должен быть блок поиска, который будет фильтровать строки при вводе текста в него. Если текст блока поиска появляется в любом из 2-3 столбца, которые должны показать эту строку. В приведенном примере это делается только для одного столбца (имя).

<el-table
    :data="tableData.filter(data => !search || data.name.toLowerCase().includes(search.toLowerCase()))"
    style="width: 100%">

Как я могу выделить код, чтобы сделать его отдельной функцией, которую я могу добавить для несколькихстолбцы?

Answer 1

Вы пробовали этот способ?

Методы

methods: {
 searchData(dataTable, query) {
   return dataTable.filter(data => !search || `data.${query}.toLowerCase().includes(search.toLowerCase())`)
 }
}

Таблица

<el-table
    :data="searchData(tableData, name)" // attach your query here
    style="width: 100%">