element table展开行功能,fixed定位出现滚动条

使用element table的展开行功能,代码如下:

 <el-table
        :data="tableData5"
        style="width: 100%">
      <el-table-column
          type="selection"
          :width="100"
          align="center">
      </el-table-column>
      <el-table-column type="expand" >
        <template>
          <el-table style="width: 100%" :show-header="false" :data="tableData5" class="demo-table-expand">
            <el-table-column
                :width="100"
                fixed
                align="center">
            </el-table-column>
            <el-table-column
                :width="48"
                fixed
                align="center">
            </el-table-column>
            <el-table-column :width="WIDTH">
              <span>商品名称xxxxx</span>
            </el-table-column>
            <el-table-column    :width="WIDTH">
              <span>所属店铺</span>
            </el-table-column>
            <el-table-column    :width="WIDTH">
              <span>商品 ID</span>
            </el-table-column>
            <el-table-column    :width="WIDTH">
              <span>店铺 ID</span>
            </el-table-column>
            <el-table-column    :width="WIDTH">
              <span>商品分类</span>
            </el-table-column>
            <el-table-column    :width="WIDTH">
              <span>店铺地址</span>
            </el-table-column>
            <el-table-column
                :width="WIDTH"
                prop="desc">
              <span>描述</span>
            </el-table-column>
            <el-table-column
                :width="WIDTH"
                label="描述2"
                prop="desc">
              <span>描述</span>
            </el-table-column>
            <el-table-column
                :width="WIDTH"
                label="描述3"
                prop="desc">
              <span>描述</span>
            </el-table-column>
            <el-table-column
                :width="WIDTH"
                label="描述4"
                prop="desc">
              <span>描述</span>
            </el-table-column>
            <el-table-column
                :width="WIDTH"
                label="描述5"
                prop="desc">
              <span>描述</span>
            </el-table-column>
            <el-table-column
                fixed="right"
                :width="WIDTH"
                label="描述6"
                prop="desc">
              <span>描述</span>
            </el-table-column>
          </el-table>
        </template>
      </el-table-column>
      <el-table-column
          :width="WIDTH"
          label="p商品 ID"
          prop="id">
      </el-table-column>
      <el-table-column
          :width="WIDTH"
          label="商品名称"
          prop="name">
      </el-table-column>
      <el-table-column
          :width="WIDTH"
          label="描述"
          prop="desc">
      </el-table-column>
      <el-table-column
          :width="WIDTH"
          label="描述2"
          prop="desc">
      </el-table-column>
      <el-table-column
          :width="WIDTH"
          label="描述3"
          prop="desc">
      </el-table-column>
      <el-table-column
          :width="WIDTH"
          label="描述4"
          prop="desc">
      </el-table-column>
      <el-table-column
          :width="WIDTH"
          label="描述5"
          prop="desc">
      </el-table-column>
      <el-table-column
          fixed="right"
          :width="WIDTH"
          label="描述6"
          prop="desc">
      </el-table-column>
    </el-table>
 tableData5: [{
          id: '12987122',
          name: '好滋好味鸡蛋仔',
          category: '江浙小吃、小吃零食',
          desc: '荷兰优质淡奶,奶香浓而不腻',
          address: '上海市普陀区真北路',
          shop: '王小虎夫妻店',
          shopId: '10333'
        }, {
          id: '12987123',
          name: '好滋好味鸡蛋仔',
          category: '江浙小吃、小吃零食',
          desc: '荷兰优质淡奶,奶香浓而不腻',
          address: '上海市普陀区真北路',
          shop: '王小虎夫妻店',
          shopId: '10333'
        }, {
          id: '12987125',
          name: '好滋好味鸡蛋仔',
          category: '江浙小吃、小吃零食',
          desc: '荷兰优质淡奶,奶香浓而不腻',
          address: '上海市普陀区真北路',
          shop: '王小虎夫妻店',
          shopId: '10333'
        }, {
          id: '12987126',
          name: '好滋好味鸡蛋仔',
          category: '江浙小吃、小吃零食',
          desc: '荷兰优质淡奶,奶香浓而不腻',
          address: '上海市普陀区真北路',
          shop: '王小虎夫妻店',
          shopId: '10333'
        }],
        tableData: [{
          date: '2016-05-03',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333,
          isShow: false
        }, {
          date: '2016-05-02',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-04',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-01',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }]
/deep/  .el-table__expanded-cell {
    padding: 0;
   
   然后,子表出现横向滚动条了:
   
   如果使用:  ::-webkit-scrollbar{display:none;}
   
   父表最下面的滚动条也没有了,
   请问如何去掉横向滚动条?
 ![image](/img/bVcNi0y)
阅读 3.1k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进