我正在使用ReactJs来构建我的Web应用程序。应用程序有一个状态变量,其中包含应用程序的状态。我的应用程序有一个功能,用户可以看到三个单选按钮(thousands, millions, actual
)。当用户点击thousands
单选按钮时,我需要显示数千的所有数值。相同的登录适用于数百万。
state变量包含object数组。每个对象都可以拥有自己的属性集。每个属性可以是数字,对象,布尔值或字符串。
我想要的是:我想查看每个属性,检查它是否为数字类型,如果为true,则在检查千位单选按钮的情况下将每个值除以1000(类似于百万按钮的逻辑)。
达到预期结果的最有效方法是什么。
答案 0 :(得分:0)
要进行格式化,请使用https://www.npmjs.com/package/format-number之类的内容。
在组件的渲染功能中,使用array.filter过滤掉任何非数字值,然后将结果映射到类似renderValue
的函数。在此函数中,检查当前选择的格式化程序,该格式化程序将保存在this.state.formatter
状态(我将在一秒钟内完成)。使用format-number
包和this.state.formatter
格式化工具格式化您的价值并显示它。
过滤看起来类似于:
this.props.values.filter((value) => !isNaN(value)).map(this.renderValue)
在将格式化程序设置为state时,创建<Input type="radio" name="format" value={1000} onChange={this.handleChange}/>
和handleChange函数:
handleChange: function(event) {
this.setState({formatter: event.target.value});
}