答案 0 :(得分:0)
我认为,如果您根据对切片器选择进行排序的方式对名称进行排名,就可以做到这一点。
创建一个度量,该度量会读取您的<template>
<div class="text-left m-4 p-4">
<div>
Total Number Events: {{ allEvents.length }}
</div>
<div>
Events Created In Last 7 Days: {{ createdEvents }}
</div>
<div>
Future Events: {{ futureEvents }}
</div>
<div>
Past Events: {{ pastEvents }}
</div>
</div>
</template>
<script>
import { mapState } from 'vuex'
export default {
data () {
return {
now: new Date().getUTCSeconds()
}
},
created () {
this.scheduleUpdateNow();
},
methods: {
updateNow() {
this.now = new Date().getUTCSeconds();
this.scheduleUpdateNow();
},
scheduleUpdateNow() {
setTimeout(this.updateNow, 1000);
}
},
computed: {
...mapState(['allEvents']),
futureEvents () {
return this.$store.state.allEvents.filter(allEvents => allEvents.dtstart > this.now).length
},
pastEvents () {
return this.$store.state.allEvents.filter(allEvents => allEvents.dtstart <= this.now).length
},
createdEvents () {
return this.$store.state.allEvents.filter(
allEvents => allEvents.created >= this.now && allEvents.created <= this.now).length
}
}
}
</script>
选择,并使用Sort By
函数针对不同的选项相应地计算排名。
将该度量作为工具提示添加到视觉中。
您现在应该可以在该度量上对视觉进行排序。
不太优雅,但解决方法也不太糟糕。