javascript – 如何使用Vue Slider控制元素

前端之家收集整理的这篇文章主要介绍了javascript – 如何使用Vue Slider控制元素前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我在请求json对象中有一堆数据.默认情况下,所有数据都显示用户.另外,我有一个滑块组件.我试图使功能,当用户移动滑块时,json的元素根据滑块的值显示/消失.

例如:

数据:

requests:  [
              {value: 10,name: "foo"},{value: 12,name: "bar"},{value: 14,name: "foobar"},{value: 22,name: "test"},{value: 1,name: "testtooo"},{value: 8,name: "something"}
            ]

默认情况下,我希望显示所有数据,但是当用户移动滑块时,我只希望显示的数据值大于滑块的当前值.

我在这里制作了一个JS小提琴:https://jsfiddle.net/hvb9hvog/9/

如何根据滑块的值修改请求json?

解决方法

为filteredRequests创建另一个计算属性.
filteredRequests(){
    return this.requests.filter(r => r.value > this.num)
 }

并使用它来列出请求.

<li v-for="request in filteredRequests">

Updated fiddle.

猜你在找的JavaScript相关文章