V01 Vue.js 实战教程 - 基础篇10.3. 搜索结果排序
简介
本小节中，我们将在搜索结果页添加如下的排序方式列表，来获取排序后的搜索结果：
filters: [ // 排序方式列表
{
filter: 'default',
title: '相关性排序',
icon: 'random'
},
{
filter: 'vote',
title: '点赞数排序',
icon: 'thumbs-up'
}
]添加页面逻辑
1、打开 src/views/Search.vue 文件，修改 <script>（注释部分是涉及的修改）：
src/views/Search.vue
<script>
export default {
name: 'Search',
data() {
return {
keyword: '',
results: [],
filter: 'default', // 默认排序方式
filters: [ // 排序方式列表
{
filter: 'default',
title: '相关性排序',
icon: 'random'
},
{
filter: 'vote',
title: '点赞数排序',
icon: 'thumbs-up'
}
]
}
},
beforeRouteEnter(to, from, next) {
next(vm => {...
关于 LearnKu
粤公网安备 44030502004330号