简体   繁体   English

无法使用 lodash 和 vueJS 对数组进行排序

[英]Unable to sort array with lodash and vueJS

I am trying to build a single paged website to display covid cases in India.我正在尝试建立一个单页网站来显示印度的 Covid 病例。 The base url is returning an array sorted alphabetically.基本 url 返回按字母顺序排序的数组。 I want to sort it according to "totalConfirmed".我想根据“totalConfirmed”对其进行排序。 Here is my code.这是我的代码。

 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Covid19 India</title> <!-- Bootstrap CSS 4.3.1 --> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <!-- Axios --> <script src="https://unpkg.com/axios/dist/axios.min.js"></script> <!-- VueJS --> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <!-- Lodash --> <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/0.10.0/lodash.min.js"></script> </head> <body> <div class="container mt-4" id="app"> <table class="table-responsive"> <table class="table"> <thead> <tr> <th scope="col">#</th> <th scope="col">Location</th> <th scope="col">Total</th> <th scope="col">Active</th> <th scope="col">Recovered</th> <th scope="col">Deaths</th> </tr> </thead> <tbody> <tr v-for="state, index in states"> <th scope="row">{{ index + 1 }}</th> <td>{{ state.loc }}</td> <td>{{ state.totalConfirmed }}</td> <td>{{ state.totalConfirmed - (state.discharged + state.deaths)}}</td> <td>{{ state.discharged }}</td> <td>{{ state.deaths }}</td> </tr> </tbody> </table> </table> </div> <script> const cases = []; var app = new Vue({ el: '#app', data: { states: [] }, mounted: function() { axios.get('https://api.rootnet.in/covid19-in/stats/latest') .then(response => { this.states = response.data.data.regional; this.states = cases; cases = _.orderBy(cases, 'totalConfirmed', 'desc'); console.log(cases); }) .catch(error => { console.log(error); }); } }) </script> </body> </html>

In my console I am getting an error "TypeError: _.orderBy is not a function".在我的控制台中,我收到一个错误“TypeError: _.orderBy is not a function”。 What could it be that I am doing wrong here?我在这里做错了什么? If I dont use orderBy my code is running fine with no errors.如果我不使用 orderBy,我的代码运行良好,没有错误。

Try adding the lodash library.尝试添加 lodash 库。

const _ = require('lodash');     
cases = _.orderBy(cases, ['totalConfirmed']);

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM