原生微信小程序封装tab切换组件

1、在components文件夹新建文件夹，比如zs-tab。

2、zs-tab文件夹的json文件：

{
  "component": true,
  "styleIsolation": "apply-shared",
  "usingComponents": {}
}

3、zs-tab文件夹的html文件：

<view class="flex justify-around">
  <view wx:for="{
  { list }}" wx:key="*this" style="{
  { value === item ? 'color:#FF3000' : '' }} padding:0rpx 30rpx; text-weight:bold;" data-value="{
  { item }}" bind:tap="change">
    <view>{
  { item }}</view>
    <view class="tab-item-bottom" style="margin-top:20rpx; {
  { value === item ? 'background:#FF3000;' : '' }}"></view>
  </view>
</view>

4、zs-tab文件夹的css文件：

.tab-item-bottom {
  height: 6rpx;
  border-radius: 3rpx