小程序内通过style属性控制scss变量修改weui组件样式＜mp-tabs＞高度自适应

小程序内通过js控制scss变量修改weui组件样式，高度自适应

1. 举个例子拿这个weui组件说明一下：进入该组件wxml内为你想修改标签内增加style属性
   

2. 小程序组件的properties属性可以定义变量，通过改变量可在外部修改组件样式。所以进入该组件的js页面，找到properties属性增加style变量：
   

3. 组件内部完成之后，回到使用该组件的page页面中修改标签：swiperClass属性值是组件内swiper标签的class名，weui-tabs-swiper可以直接修改swiper样式。而scss就是我们上面定义的style属性值

<mp-tabs tabs="{{tabs}}" activeTab="{{activeTab}}" swiperClass="weui-tabs-swiper" scss="{{scss}}" bindtabclick="onTabClick" bindchange="onChange" activeClass="tab-bar-title__selected">

4. 小程序无法通过.style.setProperty动态改变scss变量和css变量，但是可以通过{{}}双向绑定的方式去改变，在scss页面或者wxss页面，以下是scss例子：通过scss的@media进行设备的适配（样式的顺序很重要，也是基本知识），weui-tabs-swiper的高度是tabs组件内容的展示高度（此高度是固定的），为了展示不同手机内不同数据个数的要求，设置一个变量count。
   
5. 回到使用tabs组件的js页面通过this.setData方式传递count变量值：

 this.setData({
              scss: `--count--:${len}`,
            });