uni-app组件总结一:input和textarea,以及textarea显示在最上面的解决方案

uni-app colorui组件总结一

  • input
  • textarea
    • textarea组件在微信小程序属于原生组件处于最高级 (苹果和开发工具上是正常的,安卓是一直显示在最上面)
      • 解决方法一 cover-view
      • 解决方法二 亲测

input

html

	<view class="cu-form-group ">
		<view class="title">姓名</view>
		<input placeholder="请输入姓名" type="text" :value="item.name" @input="nameInput"/>
		//或者
		//
	</view>

data

item:{
		name:"123"
}

js

nameInput(e) {
	this.item.name = e.detail.value;
},

效果
在这里插入图片描述

uni-app组件总结一:input和textarea,以及textarea显示在最上面的解决方案_第1张图片
比如type=idcard时在安卓手机上
uni-app组件总结一:input和textarea,以及textarea显示在最上面的解决方案_第2张图片
type=number
uni-app组件总结一:input和textarea,以及textarea显示在最上面的解决方案_第3张图片

uni-app组件总结一:input和textarea,以及textarea显示在最上面的解决方案_第4张图片

textarea

html

	<view class="cu-form-group ">
		<view class="title">描述</view>
		<textarea placeholder="请输入" type="text" :value="item.text" @input="textInput"/>
		//或者
		//