<template>
<view>
<view >
<textarea style="z-index: 1;" placeholder="啊哈哈哈哈" placeholder-style="z-index:1"></textarea>
</view>
<view style="z-index: 999;position: absolute;background-color: #000;width: 100%;height: 800rpx;opacity: .4;top: 0;">
<view style="z-index: 999;width: 700rpx;height: 400rpx;background-color: #fff;"></view>
</view>
</view>
</template>
- 发布:2020-06-20 16:43
- 更新:2020-06-20 17:16
- 阅读:909
产品分类: uniapp/小程序/微信
PC开发环境操作系统: Mac
PC开发环境操作系统版本号: 10.14.5
HBuilderX类型: 正式
HBuilderX版本号: 2.7.9
第三方开发者工具版本号: 1.02.1911181
基础库版本号: 2.9.2
项目创建方式: HBuilderX
示例代码:
操作步骤:
<template>
<view>
<view >
<textarea style="z-index: 1;" placeholder="啊哈哈哈哈" placeholder-style="z-index:1"></textarea>
</view>
<view style="z-index: 999;position: absolute;background-color: #000;width: 100%;height: 800rpx;opacity: .4;top: 0;">
<view style="z-index: 999;width: 700rpx;height: 400rpx;background-color: #fff;"></view>
</view>
</view>
</template>
<template>
<view>
<view >
<textarea style="z-index: 1;" placeholder="啊哈哈哈哈" placeholder-style="z-index:1"></textarea>
</view>
<view style="z-index: 999;position: absolute;background-color: #000;width: 100%;height: 800rpx;opacity: .4;top: 0;">
<view style="z-index: 999;width: 700rpx;height: 400rpx;background-color: #fff;"></view>
</view>
</view>
</template>
预期结果:
textarea显示在最底层
textarea显示在最底层
实际结果:
textarea显示在最上层
textarea显示在最上层
bug描述:
小程序中使用了textarea,然后需要在当前页面最上层显示弹出层,发现textarea显示在了最上层,换成input就没问题。
阿条 - 一个孤独的码农
这个是微信小程序的问题。
貌似目前都还没修复,暂时可以换个思路。
弹出层弹出和收回的时候控制textarea的显示与隐藏
https://developers.weixin.qq.com/community/develop/doc/0002c63bf440e827afb6e838551800
这个帖子中也有人说使用cover-view
https://developers.weixin.qq.com/community/develop/doc/00004c33acc39015fed6bc2aa55400
这个帖子里有官方回答