小程序关于textarea浮上弹出层的解决方法

小程序关于textarea浮上弹出层的解决方法

小程序关于textarea浮上弹出层的解决方法

最近项目中有个自定义弹出层的需求，刚开始做出来，还觉得小有一点成就感，马上测试数据都录入之后，就发现，下层form表单中的文字浮上来了，在弹出层上，检查发现是有用到textarea的地方，文字出现此问题。

找原因

1.首先想到是不是因为 textarea 的原因，因为input文字正确，检查之后，发现没错；
2.再就想到是不是z-index原因，就给弹出层背景99，弹出层提示框999层级，又给表单给了负的层级，结果还是textarea内容浮于表面；
3.再就判断可能不是层级原因，最后，使用了hidden，当输完内容，弹出提示框后，先暂时隐藏表单hidden={{hideForm}},hideform初始为false, 当hideForm为true，问题得到解决。

复盘

刚开始其实还试过是不是文字太长透出来，长短测试几遍，发现不是的，之所以不是一开始就想到是层级原因,是因为刚开始就给了弹出层层级，给了定位，它才能显示在最最上层，且问题不是整个下层表单内容透上来，然后就怀疑自己是不是层级有误，检查一番后，没错，才用了第二种方法测。

总结

总结:遇到问题，先自己找原因，看文档，除了固定的属性，样式等因素，其实也可灵活变通，首先以解决问题为准，再去提高性能，去优化。

一起学习前端知识，敲鱼撞钟，哈哈。