vue开发中出现警告Forced reflow while executing JavaScript took

这个问题我们用中文翻译一下：

执行JavaScript时强制回流

也就是哪里的操作 导致页面回流从而卡顿

什么是强制回流？?

点我了解强制回流

我遇到的情况

我写了一个试题列表，列表里面有300题，每个题目有4个选项。起初我觉得有点卡，但是觉得数据量才这么点就卡很不合理就先放着没管。
直到我数据量到了500以上，那页面我滴天，真的迟钝！！

开始排查

首先判断是否哪里频繁使用v-if等导致的，我一块块注释重复运行发现并不是他的问题。
其次判断是否是数据渲染问题，因为我抽出了好几个组件以及v-for去循环渲染数据。在我一重重注释发现，只要把列表数据删了就不会卡顿了，但这不行啊。不能手有病我们就把手砍了对吧，我们需要找到到底哪里出现的问题。
最后在我刨根问底的过程中发现了我v-for了el-radio，看着是一点问题也没有，都是常规用法。但是一注释掉， 竟然不卡了？？！！！

找到凶手

注释掉el-radio后不卡，这让我十分愤怒和发狂哈。因为我一直以为是我哪里渲染的问题，浪费我几个小时的时间。

寻找平替

不如简简单单input哈

上代码： 注释掉的是曾经的代码

    <ul class="topic-card-radio-wrapper">
          <!-- <el-radio-group v-model="radio"> -->
          <li v-for="item in topicData.answerVOList" :key="item.id" class="topic-card-item">
            <!-- <el-radio :label="item.id" :disabled="topicSettings && topicSettings.isDisabled">
                {{ item.sort }}
                <span>.</span>
                {{ item.optionTitle }}
              </el-radio> -->

            <input @change="checkedAnswer(item.id);" type="radio" :id="`exam-answer-${item.id}`"
              :name="topicData.questionId" :value="item.id" v-model="radio"
              :disabled="topicSettings && topicSettings.isDisabled" />
            <label :for="`exam-answer-${item.id}`"> <span>
                {{ item.sort }}
                <span>.</span>
                {{ item.optionTitle }}
              </span>
            </label>
          </li>
          <!-- </el-radio-group> -->
        </ul>

完结， 如果使用el-raidio也可以解决这个问题 请指教！！