reactjs - 我们如何自动将逗号添加到在 SPFx 中输入的数字反应流畅的文本字段。例如：1,000,000,000

Question

<div>
<TextField
value={this.state.Budget}
onChanged={this.onChangeBudget}
/>
</div> 

public onChangeBudget = (value: string) => 
{
console.log("Budget : " + value);
console.log(value.replace(/\B(?=(\d{3})+(?!\d))/g, ','));
let abc = value.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
return this.setState({ Budget: abc });
}

所以问题是当我记录它显示正确结果的值时（1,111,111,111）但是当我为它做 setState 时它是这样显示的（1,1,1,1,1,1,1,1,111 ）。请建议我哪里出错了。

所需输出为 - 1,000 10,000 100,000 1,000,000 10,000,000 100,000,000 1,000,0000,000

Answer 1

请参阅链接问题以获取有关如何在当前语言环境中使用千位分隔符打印数字的正确答案（您在调试窗口中看到的内容）。与 SPFx 相关，您可以从上下文中获取语言环境。它可能看起来像这样（假设 Web 部件的上下文）：

const culture = this.context.pageContext.cultureInfo.currentCultureName;
const value.toLocaleString(culture)

如果您对支持多种语言不感兴趣，那么简单value.toLocaleString()应该就足够了。