Vue數據動態過濾指通過Vue實現對數據的動態過濾，使得在進行數據展示時，只顯示部分數據，或對數據進行特殊形式的展示。這個功能能夠非常靈活的進行數據操作，適用于各種數據展示需求。

data: {
list: [
{ id: 1, name: '小明', age: 18 },
{ id: 2, name: '小紅', age: 20 },
{ id: 3, name: '小剛', age: 19 }
],
keyword: ''
},
computed: {
filterList () {
const keyword = this.keyword.trim().toLowerCase()
if (!keyword) {
return this.list
}
return this.list.filter(item =>{
return item.name.toLowerCase().indexOf(keyword) !== -1
})
}
}

在Vue中，通過計算屬性實現對數據的過濾。我們可以通過computed屬性來對數據進行計算，并返回計算后的新數據，Vue會自動監聽計算屬性的變化，并實時進行數據更新。

通過上述代碼，我們可以看出，data中定義了一個list數組，用來存儲我們的數據，keyword是一個關鍵詞，用來進行過濾。可以看出，filterList方法通過對keyword進行監聽，在keyword發生變化時，對list進行過濾并返回符合的結果。

data: {
list: [
{ id: 1, name: '小明', age: 18 },
{ id: 2, name: '小紅', age: 20 },
{ id: 3, name: '小剛', age: 19 }
],
keyword: '',
sortType: ''
},
computed: {
filterList () {
const keyword = this.keyword.trim().toLowerCase()
if (!keyword) {
return this.list
}
const filterResult = this.list.filter(item =>{
return item.name.toLowerCase().indexOf(keyword) !== -1
})
if (this.sortType) {
sortedFilterResult = filterResult.sort((a, b) =>{
if (this.sortType === 'name') {
return a.name.localeCompare(b.name)
} else if (this.sortType === 'age') {
return a.age - b.age
}
})
return sortedFilterResult
}
return filterResult
}
}

在實際應用中，我們還需要對數據進行排序，邏輯也非常簡單，在上述代碼中，我們增加了一個sortType變量，用來存儲當前的排序類型。在filterList方法中，我們增加了一個conditional判斷，當sortType存在時，使用sort函數對過濾后的數組進行排序，否則直接返回過濾后的結果。

可以看到，通過Vue實現數據動態過濾，我們可以非常靈活的控制數據展示，適用于各類應用場景。在使用中，需要根據實際需求來靈活運用各種方式來實現。