减少小数位并使用vue js添加逗号(Reduce decimal places and add commas using vue js)
我有一个vue js数据值,我从json得到。 我在v-for prop中使用json来使Li成为侧导航。 json中的一个对象是一个很长的数字。 在for循环中使用vuejs解析它的最佳方法是什么。
我已经尝试过vue-numeric但是无法正常工作,因为我没有在这个项目中使用ecmascript 6而我只是想将它添加到主vue脚本中。
data: {
poolAPIData: {},
},
this.poolAPIData = $.ajax({
dataType: "json",
url: 'https://coinstop.me/api/',
success: (data => this.poolAPIData = data)
})
;
我需要解析Difficulty参数,每3位数有2个小数位和逗号。
I have a vue js Data value that i get from a json. I use the json in a v-for prop to make Li for a side nav. One of the objects in the json it a long number. What would be the best way to parse it using vuejs within a for loop.
I have tried vue-numeric but could not get that to work properly because i am not using ecmascript 6 in this project and i just want to add it to the main vue script.
data: {
poolAPIData: {},
},
this.poolAPIData = $.ajax({
dataType: "json",
url: 'https://coinstop.me/api/',
success: (data => this.poolAPIData = data)
})
;
i need to parse the Difficulty argument to have 2 decimal places and commas every 3 digits.
原文:https://stackoverflow.com/questions/48132763
更新时间:2019-12-11 17:35
最满意答案
您可以使用通过Number#toLocaleString()运行给定值的过滤器 ,并将maximumFractionDigits选项设置为2 :
new Vue({
// ...
filters: {
currency(amount) {
const amt = Number(amount)
return amt && amt.toLocaleString(undefined, {maximumFractionDigits:2}) || '0'
}
}
})
// usage in HTML: {{poolAPIData[pool.tag].difficulty | currency}}
new Vue({
el: '#app',
data: {
poolAPIData: {
nul: {
difficulty: null
},
str: {
difficulty: "1234567.890123456789"
},
num: {
difficulty: 1234567.890123
}
}
},
filters: {
currency(amount) {
const amt = Number(amount)
return amt && amt.toLocaleString(undefined, {maximumFractionDigits:2}) || '0'
}
}
})
{{ poolAPIData['nul'].difficulty | currency }}
{{ poolAPIData['str'].difficulty | currency }}
{{ poolAPIData['num'].difficulty | currency }}
You could use a filter that runs the given value through Number#toLocaleString(), with the maximumFractionDigits option set to 2:
new Vue({
// ...
filters: {
currency(amount) {
const amt = Number(amount)
return amt && amt.toLocaleString(undefined, {maximumFractionDigits:2}) || '0'
}
}
})
// usage in HTML: {{poolAPIData[pool.tag].difficulty | currency}}
new Vue({
el: '#app',
data: {
poolAPIData: {
nul: {
difficulty: null
},
str: {
difficulty: "1234567.890123456789"
},
num: {
difficulty: 1234567.890123
}
}
},
filters: {
currency(amount) {
const amt = Number(amount)
return amt && amt.toLocaleString(undefined, {maximumFractionDigits:2}) || '0'
}
}
})
{{ poolAPIData['nul'].difficulty | currency }}
{{ poolAPIData['str'].difficulty | currency }}
{{ poolAPIData['num'].difficulty | currency }}
2018-07-20
相关问答
你根本不需要jQuery。 您watch变量,然后在监视函数中计算重新格式化的版本,然后使用nextTick将其设置回您的变量(因此在手表完成之前不会进行变异)。 new Vue({
el: '#vue',
data: {
price: 0
},
watch: {
price: function(newValue) {
const result = newValue.replace(/\D/g, "")
.replace(
...
假设这是一个变量,它可以在小数之前有任意数量的位置: $ var=8.577772
$ printf "%s.%.3s\n" $( echo $var | tr '.' ' ' )
8.577
$ var=134.56789
$ printf "%s.%.3s\n" $( echo $var | tr '.' ' ' )
134.567
Assuming this is a variable, which can have any number of places before the dec
...
使用正则表达式 using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Text.RegularExpressions;
namespace ConsoleApplication1
{
class Program
{
static void Main(string[] args)
{
...
您可以使用通过Number#toLocaleString()运行给定值的过滤器 ,并将maximumFractionDigits选项设置为2 : new Vue({
// ...
filters: {
currency(amount) {
const amt = Number(amount)
return amt && amt.toLocaleString(undefined, {maximumFractionDigits:2}) || '0'
}
...
你几乎拥有它......尝试这个怎么样: {Binding ANLA, StringFormat='0,0.'}
请注意,这会将数字四舍五入到最接近的整数。 You almost had it... how about trying this: {Binding ANLA, StringFormat='0,0.'}
Please note that this will round the number to the nearest integer.
以下是我认为可以帮助您的输入。 它在另一篇文章中回答: Angular2中的数字管道无法正常工作 Here is the input I think will help you. It was answered in a different post: Number pipes in Angular2 not working as I would expect
有没有办法让'double.toString()'中的结果字符串包含double的确切值? 它确实包含double的确切值 - 但double不存储123和123.0和123.00之间的任何差异。 但是, decimal存储差异 - 如果你关心的是精确的十进制数字,则更合适。 另一方面,听起来实际上你在错误的地方进行比较: 我试图这样做的原因是因为我有自定义文本框必须使用与实际显示的值不同的值,并且当尝试在此文本框中输入您自己的值时,文本框会忽略您的文本尝试在小数位数输入零。 不要比较字符串值 -
...
如果您希望丢弃前面的三个字符,则使用A1中的数据,在另一个单元格中输入: =MID(A1,4,9999)
如果您的数据在数字前后有可变数量的垃圾字符,那么您可以使用以下用户定义函数: Public Function eXtractor(rin As Range) As String
Dim v As String, L As String, i As Long, CH As String
eXtractor = ""
v = rin.Text
L = Len(v)
...
您可以使用currency过滤器为货币符号使用空字符串执行此操作: {{variable | currency:""}}
如果要更改小数位数,可以将其指定为参数(默认值为2): {{variable | currency:"":3}}
You can do this with a currency filter using an empty string for the currency symbol: {{variable | currency:""}}
If you want to c
...