uni-app 3.2.9版本 nvue下iOS平台 textarea 组件 line-height 设置无效 且存在默认 padding
uni-app 3.2.9版本 nvue下iOS平台 textarea 组件 line-height 设置无效 且存在默认 padding
| 开发环境 | 版本号 | 项目创建方式 |
|---|---|---|
| Mac | macOS Big Sur 11.6 | HBuilderX |
产品分类:uniapp/App
PC开发环境操作系统:Mac
PC开发环境操作系统版本号:macOS Big Sur 11.6
HBuilderX类型:正式
HBuilderX版本号:3.2.9
手机系统:iOS
手机系统版本号:IOS 14
手机厂商:模拟器
手机机型:iPhone 12
页面类型:vue
打包方式:云端
示例代码:
<template>
<view class="page">
<view>
<text class="title">nvue下ios内行高设置失效</text>
<textarea
class="textarea"
:class="{ 'disable-default-padding': ios }"
:placeholder="place"
:placeholder-style="style"
:adjust-position="false"
></textarea>
<text class="title">nvue下ios内存在默认padding</text>
<textarea class="textarea" :placeholder="place" :placeholder-style="style" :adjust-position="false"></textarea>
<text class="title">text组件预期表现正常</text>
<text class="textarea" :style="style">{{ place }}</text>
</view>
</view>
</template>
<script>
export default {
data() {
const sys = uni.getSystemInfoSync()
return {
place: '来分享点什么吧~记得打上具体的作品名称哦。PS:如果编辑内容过长,请先在手机备忘录等工具编辑好后,再复制发布~',
style: 'color:#ccc;line-height:44rpx;',
ios: sys.platform === 'ios'
}
}
}
</script>
<style lang="scss" scoped>
.page {
flex: 1;
width: 750rpx;
padding: 32rpx;
background: #f6f8f9;
}
.title {
margin-bottom: 24rpx;
font-size: 28rpx;
line-height: 44rpx;
color: #333;
}
.textarea {
height: 3 * 44rpx; // 3行应该刚好触底
margin-bottom: 32rpx;
font-size: 28rpx;
line-height: 44rpx;
color: #333;
background: white;
// 是否去掉 iOS 下的默认内边距 https://uniapp.dcloud.io/component/textarea
&.disable-default-padding {
padding: 2rpx -10rpx;
}
}
</style>
操作步骤:
运行到ios模拟器即可
预期结果:
textarea 显示padding正常或可配置,行高设置正常
实际结果:
textarea 显示异常
bug描述:
nvue下ios中,textarea问题如下:
- 存在默认padding,麻烦要么去掉,要么和小程序一样可配置
- placeholder 设置行高无效
- 首次聚焦的时候,placeholder会抖动

更多关于uni-app 3.2.9版本 nvue下iOS平台 textarea 组件 line-height 设置无效 且存在默认 padding的实战教程也可以访问 https://www.itying.com/category-93-b0.html
补充一下
更多关于uni-app 3.2.9版本 nvue下iOS平台 textarea 组件 line-height 设置无效 且存在默认 padding的实战教程也可以访问 https://www.itying.com/category-93-b0.html
麻烦官方看下,padding的问题,目前还能hack解决,行高是真的影响设计体验
你好感谢反馈,默认存在 padding 的问题下个版本会修复,lineHeight 的问题iOS和Android端都不支持,暂时无法解决,可以使用 vue 页面实现
3.2.10 左右的padding 还是存在
回复 青阳_1900: … 左右的给漏了,下个版本修复
21年就提的bug,现在都还没修复
左右padding 的问题,使用 HX3.2.11测试一下是否正常
目前看正常了

