uni-app textarea覆盖问题

textarea在小程序中是原生组件，层级比较高，即使给fix+9999也是被覆盖了。
看了很多解决办法，但是改动量有点大，想找个代码量少的方法。

从uni-app的官网上找了一个组件cover-view
结合该组件的介绍我们可以知道如果我给我的fix包裹一层cover-view，那么就不会被textarea覆盖了，想法是很简单，但是实际上调试的过程很麻烦，太费时间。
遇到的主要问题有2个
1.1px边框没了（使用cover-view代替伪元素）
2.1px边框有了 但是按钮点不动了（将事件绑定在父节点上）

最终代码如下

<template>
  <cover-view class="add_wrap">
    <cover-view class="add_button_wrap" @click="doClick">
      <button class="add_button">
        {{ title }}
      </button>
      <cover-view class="half_after"></cover-view>
    </cover-view>
  </cover-view>
</template>

<script>
export default {
  props: ["title"],
  methods: {
    doClick() {
      this.$emit("clicked");
    },
  },
};
</script>

<style lang="less" scoped>
.add_wrap {
  position: fixed;
  left: 0;
  bottom: 0;
  z-index: 9999;
  width: 100%;
  .add_button_wrap {
    position: relative;
    z-index: 99;
    background: #ffffff;
    padding: 20rpx 45rpx;
    box-sizing: border-box;
  }
  .add_button {
    height: 98rpx;
    background: #008fff;
    color: #ffffff;
    border-radius: 6rpx;
  }
}
.half_after {
  position: absolute;
  z-index: 1;//无效
  left: 0;
  top: 0;
  width: 200%;
  height: 200%;
  border-top: 1px solid #e6e6e6;
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0;
  -webkit-transform: scale(0.5, 0.5);
  transform: scale(0.5, 0.5);
  pointer-events: none;
}
</style>