ITPub博客

首页 > IT职业 > IT生活 > 使用vue实现数组对象排序

使用vue实现数组对象排序

IT生活 作者:ITpubnet 时间:2021-09-09 10:09:14 0 删除 编辑

从网上找到的例子用vue来实现数组对象排序

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    <meta http-equiv="X-UA-Compatible" content="ie=edge">    <title>vue</title>    <script class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="https://cdn.bootcss.com/vue/2.4.2/vue.min.js"></script></head><body>    <div class="app">            <h1>vue</h1>            <hr>            <ol>                <li v-for="number in sortNumbers">{{number}}</li>            </ol>            <hr>            <ul>                <li v-for="(student,index) in  sortstudents">{{index+1}}:{{student.name}}-{{student.age}}</li>            </ul>    </div>          <script>                new Vue({                    el:'.app',                    data:{                                numbers:[5 ,8, 88, 56, 28, 61, 9],                                students:[                                     {name:'zs',age:'38'} ,                                     { name:'ls',age:'29'},                                     {name:'mike',age:'32'},                                ]                     },                    computed:{                            sortNumbers:function(){                                        return this.numbers.sort( sortNumbers);                            },                            sortstudents:function(){                                        return sortByKey(this.students,'age')                            }                        }             });            function sortNumbers(a,b){                    return a-b;            }            //数组对象排序            function sortByKey(array,key){                    return array.sort(function(a,b){                            var x = a[key];                            var y = b[key];                            console.log(x,y)                            return((x>y)?-1:((x<y)?1:0));                    })            }    </script></body></html>

来自 “ ITPUB博客 ” ,链接:https://blog.itpub.net/4556/viewspace-2817555/ ,如需转载,请注明出处,否则将追究法律责任。

下一篇: GO语言数组
请登录后发表评论 登录
全部评论

注册时间:2019-08-13

  • 博文量
    91
  • 访问量
    899