css 父元素clip-path方法导致子元素 z-index：-1 无效？

当前效果

加了clip-path后

<view class="top_case">
  <view class="case_back"></view>
  <view class="flex-column case_tilte">
    <text>Q&A</text>
    <text>市场问答</text>
  </view>
</view>

css

.top_case {
  height: 240rpx;
  background: #E4C9FE;
  -webkit-clip-path: polygon(90% 0, 100% 28%, 100% 100%, 0 100%, 0 0);
  clip-path: polygon(90% 0, 100% 28%, 100% 100%, 0 100%, 0 0);
  margin: 30rpx 40rpx;
  position: relative;
}

.case_back {
  width: 100%;
  height: inherit;
  background: #212121;
  -webkit-clip-path: polygon(90% 0, 100% 28%, 100% 100%, 0 100%, 0 0);
  clip-path: polygon(90% 0, 100% 28%, 100% 100%, 0 100%, 0 0);
  position: absolute;
  left: 10rpx;
  top: 10rpx;
  z-index: -1;
}