屏幕自适应问题与tab状态更新数据问题

最头疼的就是屏幕自适应的问题

现在普遍的ui库都有自适应，自适应主要这样使用

<el-row>
  <el-col :span="8"><div class="grid-content bg-purple"></div></el-col>
  <el-col :span="8"><div class="grid-content bg-purple-light"></div></el-col>
  <el-col :span="8"><div class="grid-content bg-purple"></div></el-col>
</el-row>

:xs="12" :sm="8" :md="6" :lg="6" :xl="6"
从小到大   一行显示 2 ，3 ，4 ， 4， 4
如果想要中间有缝隙
最外层的div里面再套一层div，设置里面的div的padding值

 比如说遇到那种tab选项卡分页的情况

是根据type来进行分类查询的，设置方法的时候，最好通过

    getMyResource () {
      getMyResourceData(this.sourceType).then((res) => {
        if (res.data.code === 0) {
          this.resourceList = res.data.data
        }
      })
    }
把状态放在data里面，这样一切换的时候设置状态就好了
这样做的好处是，在你进行增删改查的时候，会重新调用这个getdata的方法，这时候就不用考虑状态是谁了