uni-app uni-popup弹出层scroll-view固定高度内表单日期时间组件点击选择时间后,安卓和微信开发者工具正常,苹果手机日期组件被遮挡显示不全
uni-app uni-popup弹出层scroll-view固定高度内表单日期时间组件点击选择时间后,安卓和微信开发者工具正常,苹果手机日期组件被遮挡显示不全
开发环境 | 版本号 | 项目创建方式 |
---|---|---|
Mac | 14.1.1 | HBuilderX |
产品分类:uniapp/小程序/微信
PC开发环境操作系统:Mac
HBuilderX类型:正式
HBuilderX版本号:4.24
第三方开发者工具版本号:当前已是最新版本(1.06.2407110 darwin-arm64)
基础库版本号:3.5.3
项目创建方式:HBuilderX
示例代码:
<!-- 添加或修改机器保养对话框 -->
<uni-popup ref="popup" type="center" :title="title" :visible.sync="open">
<view class="bg-white padding">
<uni-forms ref="form" :modelValue="form" :rules="rules" label-width="80px">
<scroll-view scroll-y="scroll-y" :style="'height:'+ height +'px'">
<uni-forms-item label="保养状态" name="status" :required="true">
<uni-data-select :localdata="dict.type.machine_maintenance" @change="change"
v-model="form.status" placeholder="请选择保养状态">
</uni-data-select>
</uni-forms-item>
<uni-forms-item label="保养时间" name="maintenanceTime" :required="false">
<uni-datetime-picker clearable
v-model="form.maintenanceTime"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
@change="change"
placeholder="请选择保养时间">
</uni-datetime-picker>
<!--
<view class="cu-form-group">
<picker mode="date" :value="form.maintenanceTime" @change="change">
<view class="">
{{ form.maintenanceTime }}
</view>
</picker>
</view>
-->
</uni-forms-item>
<uni-forms-item label="保养前图片" name="maintenancePicBefore" :required="false">
<image-upload v-model="form.maintenancePicBefore"/>
</uni-forms-item>
<uni-forms-item label="保养后图片" name="maintenancePicAfter" :required="false">
<image-upload v-model="form.maintenancePicAfter"/>
</uni-forms-item>
<!--
<uni-forms-item label="保养人" name="maintenancePeople" :required="false">
<uni-easyinput v-model="form.maintenancePeople" placeholder="请输入保养人"/>
</uni-forms-item>
-->
<uni-forms-item label="保养内容" name="maintenanceContent" :required="true">
<uni-easyinput v-model="form.maintenanceContent" type="textarea" placeholder="请输入内容"/>
</uni-forms-item>
<uni-forms-item label="备注" name="remark" :required="false">
<uni-easyinput v-model="form.remark" type="textarea" placeholder="请输入内容"/>
</uni-forms-item>
</scroll-view>
</uni-forms>
<view slot="footer" class="dialog-footer">
<button class="cu-btn block bg-green round shadow " :loading="buttonLoading" @click="submitForm">确 定
</button>
<button class="cu-btn block bg-gray round shadow mt10" @click="cancel">取 消</button>
</view>
</view>
</uni-popup>
onLoad(options) {
if (options.mch) {
this.mch = JSON.parse(options.mch)
this.queryParams.machineId = this.mch.machineId
}
//获取屏幕可用高度
let screenHeight = wx.getSystemInfoSync().windowHeight;
this.height = screenHeight - 200;
this.getList();
},
更多关于uni-app uni-popup弹出层scroll-view固定高度内表单日期时间组件点击选择时间后,安卓和微信开发者工具正常,苹果手机日期组件被遮挡显示不全的实战教程也可以访问 https://www.itying.com/category-93-b0.html