antd-mobile的InputItem组件中type='money'时的样式调整

 问题描述

antd-mobile的InputItem组件中type='money'时，

现状：模拟的数字键盘未居中，focus聚焦在右边。

期望：键盘内容居中，focus在左边聚焦

效果对比

修改前样式如图：

修改后样式如图：

js原代码 

//js 文件中

<InputItem
	title="重量"
	keyName='weight'
	placeholder="请输入"
	type='money'
	maxLength={5}
	rules= {[
		{required: true,message:"必填，请输入"},
		{ pattern: /^[0]*?(?:99(?:\.(?:[0-8]\d*|9(?:[0-8]\d*)?|99[0]*))?|(?:[0-8]?\d|9[0-8])(?:\.\d+)?)$/, message: '请输入小于等于99.99的数并保留两位小数' },
	]}
    form = {this.props.form}
    onBlur={this.onBlur}
    initialValue={rowData?rowData.weight:''}							
/>

 less修改代码

//less文件中

.am-number-keyboard-wrapper table tr{//数字键盘文本居中
    vertical-align: middle;
    td{
      vertical-align: middle;
    }
  }
  .am-list-item .am-input-control .fake-input-container{//antd-mobile的inputItem组件内type='money'时样式调整
    .fake-input-placeholder{
      text-align: left;
      color: rgba(25, 31, 37, 0.28);
      font-size: .3rem;
    }
    .fake-input{
      text-align: left;
    }
    .fake-input.focus:after{
      right: auto;
    }
  }