antd Input和InputNumber的细节
- InputNumber 提示’xxx is not string’
代码如下：
{getFieldDecorator('feeRate', {
initialValue: (feeRate * 100).toFixed(1),
rules: [
{
required: true,
message: '请输入费率',
},
{
max:10,
message:"最大值为10"
},
{
min:0,
message:"最小值为0"
},
],
})( <InputNumber min={0} max={1} step={0.1}/>)}
错误：InputNumber的max和min是写在标签上的，rules里的max和min是匹配Input,识别为string
但是标签又是InputNumber,所以报错
正解：
{getFieldDecorator('feeRate', {
initialValue: (feeRate * 100).toFixed(1),
rules: [
{
required: true,
message: '请输入费率',
}
],
})( <InputNumber min={0} max={1} step={0.1}/>)}
-
Input或者InputNumber 保留小数点1位
代码如下：
{getFieldDecorator('feeRate', {
initialValue: (feeRate * 100).toFixed(1),
rules: [
{
required: true,
message: '请输入费率',
},
{
required: false,
pattern: new RegExp(/^[0-9]+(\.[0-9]{1,1})?$/, "g"),
message: '小数点后保留一位',
},
],
})( <InputNumber min={0} max={1} step={0.1}/>)}
-
Form里InputNumber后面加单位
想要的样式如下：
代码如下：
<FormItem label="费率">
{getFieldDecorator('feeRate', {
initialValue: (feeRate * 100).toFixed(1),
rules: [
{
required: true,
message: '请输入费率',
},
{
required: false,
pattern: new RegExp(/^[0-9]+(\.[0-9]{1,1})?$/, "g"),
message: '小数点后保留一位',
},
],
})( <InputNumber min={0} max={1} step={0.1}/>)}
<span className="ant-form-text"> %</span>
</FormItem>
<p style={{ textAlign: 'center', fontSize: '12px' }}>(费率范围为：0%-1.0%，保留小数点后一位)</p>
其实是些很基础的问题，
但是因为运用的不熟悉，
以及看文档不够仔细耽误了时间
后期会持续更新。