I've been encountering an issue with the sort() method and I'm having trouble solving it. Essentially, I have a table displaying cryptocurrency data fetched from an API, and it has the ability to sort each column. Everything seems to be working fine for columns like Rank, Name, and MarketCap, except for the Price column. It doesn't seem to sort correctly - for instance, the price of BTC always ends up somewhere in the middle. The prices retrieved from the API are in String format.
Here's a photo of the cryptocurrency table
Below is the sorting method I am currently using:
sortBy (prop) {
if (this.sorter === 'inc') {
this.cryptos.sort((a, b) => a[prop] > b[prop] ? 1 : -1)
this.sorter = 'dec'
} else {
this.cryptos.sort((a, b) => a[prop] > b[prop] ? -1 : 1)
this.sorter = 'inc'
}
},
And here is how I invoke the sorting method in the table:
<tr>
<th class="table-header table-link" v-on:click="sortBy('rank')">Rank</th>
<th class="table-header">Icon</th>
<th class="table-header table-link" v-on:click="sortBy('name')">Name</th>
<th class="table-header">Symbol</th>
<th class="table-header table-link" v-on:click="sortBy('price')">Price</th>
<th class="table-header table-link" v-on:click="sortBy('change')">{{time}}</th>
<th class="table-header table-link" v-on:click="sortBy('marketCap')">Market Cap</th>
</tr>Sample amounts received from the API (remember they are in String format):
464.2807003746
15150.0527417405
0.5010685149
0.8374992554
0.5010685149
66.5544823869
233.8180345945
4.2255392708
10.9344985436
0.1363374574
0.16150966
I hope that provides enough information, and I would greatly appreciate any assistance on this matter. Thank you in advance!