源代碼:

<template>
    <el-row :gutter="40">
        <el-col :span="2"></el-col>
        <el-col :span="16" class="aaaa">
            <el-input placeholder="請輸入搜索用例或關鍵字" v-model="search_value">

                <template #prepend>
                    <el-select placeholder="Select" style="width: 150px" v-model="selectedValue">
                        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
                    </el-select>
                </template>

                <template #append>
                    <el-button> <el-icon>
                            <Search />
                        </el-icon> </el-button>
                </template>
            </el-input>
        </el-col>

        <el-col :span="2" class="aaaa"></el-col>
        <el-col :span="4" class="aaaa">
            <el-button type="primary" @click="AddTestCase">
                <el-icon :color="color">
                    <Plus />
                </el-icon>
                <span>添加用例</span>
            </el-button>

        </el-col>

    </el-row>

    <el-table :data="tableData" stripe>
        <el-table-column prop="index" label="Index" />
        <el-table-column prop="module" label="TestModule" />
        <el-table-column prop="case" label="TestCase" />
        <el-table-column prop="operation" label="Operation">
            <el-button type="primary" plain>編輯</el-button>
            <el-button type="danger" plain>刪除</el-button>
        </el-table-column>
    </el-table>


    <el-dialog v-model="popAdd" title="添加用例">
        <Addcase></Addcase>
    </el-dialog>
</template>

問題現(xiàn)象

調(diào)整瀏覽器界面的時候拋出異常,

問題確認

1. 按模塊注釋,然后調(diào)整瀏覽器大小
2. 確認el-table引起的.

解決方法

在main.js中添加以下代碼

// app.vue寫在script里面  main.js寫在app掛載完之后
const debounce = (fn, delay) => {
    let timer
     return (...args) => {
       if (timer) {
         clearTimeout(timer)
       }
       timer = setTimeout(() => {
         fn(...args)
       }, delay)
     }
  }
    
  const _ResizeObserver = window.ResizeObserver;
  window.ResizeObserver = class ResizeObserver extends _ResizeObserver{
     constructor(callback) {
       callback = debounce(callback, 200);
       super(callback);
     }
  }

方案來源: https://blog.csdn.net/bbt953/article/details/131658012