当使用AtActionSheetItem弹出框时,点击弹出框的位置,底下的填写框就会自动聚焦,这个就是Input框层级过高,会有穿透问题。
首先想到的方法是设置AtActionSheetItem弹出框的z-index很大,设置input框z-index很小,但是并没有作用。
最靠谱的解决方法是当AtActionSheetItem弹出时,就把input框设置为view框,不能单纯的隐藏掉input框,因为当页面滑倒AtActionSheetItem框没有遮住的位置时,就什么都看不到了,这样也算是bug。
//这里用的是taro
<View className='input-view'>
<View className='left'>数量:</View>
<View className='right'>
{selectVisible ?
(number === '' ? <View className='placeholder'>请输入数量</View> :
<View className='input'>{number}</View>) :
<Input
value={number}
className='input'
placeholderClass='placeholder'
placeholder='请输入数量'
type='number'
onInput={this.numberInput}
/>
}
</View>
</View>
<AtActionSheet isOpened={selectVisible}>