Vue 取出记录数后,页面显示刚开始显示部分,点击更多显示全部
实例的实现,是使用computed计算属性,还有对数组使用.slice函数,不改变原数据对象。
<div id="app"> <ul> <li v-for="item in filterlist">{{item}}</li> </ul> <a v-if="limitN!=list.length" v-on:click="limitN=list.length"> More > </a> </div> <script type="text/javascript"> var app = new Vue({ el: "#app", data: { list: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10], limitN:3 }, computed: { filterlist: function () { return this.list.slice(0, this.limitN); } } }) </script>