鍍金池/ 問答/HTML/ elementui表格卡頓

elementui表格卡頓

    表格最多也就50條數(shù)據(jù),為什么每次切換表格的時(shí)候會卡頓兩秒左右?如果表格十多條數(shù)據(jù)就不會卡。如何改進(jìn)一下









  <el-table :data="curr_data" height="700px" key='setTable' @selection-change="handleSelectionChange" v-else-if='type=="set"'  >
                  <el-table-column type='selection'    fixed></el-table-column>
                  
                <el-table-column v-if='isShowband()'
                  prop="band"
                  label="band"
                  width="100"
                  :filters="[{ text: '', value: '' }, { text: 'bandA', value: 'bandA' }]"
                  :filter-method="filterTag"
                  filter-placement="bottom-end">
                  <template slot-scope="scope">
                    <el-tag disable-transitions>{{scope.row.band}}</el-tag>
                  </template>
                </el-table-column>
                <el-table-column prop="name" label="name"  >
                </el-table-column>
                <el-table-column  label="value" >
                    <template slot-scope="scope">
                          <el-select  v-if='scope.row.type==7&&scope.row.enum!=-1' v-model="scope.row.dataValue" @change='changeSelect()'>
                            <el-option
                              v-for="(item,index) in enumArr[scope.row.enum]"
                              :key="item"
                              :label="item"
                              :value="index">
                            </el-option>
                          </el-select> 
                        <el-input v-model="scope.row.dataValue" v-else></el-input>
                    </template>
                </el-table-column>
                <el-table-column prop="unit"  >
                </el-table-column>    
                <el-table-column >

                    <template slot-scope="scope">
                        <span v-if='scope.row.error=="0"' style='color:green '>Success</span>
                        <span v-else-if='scope.row.error==" "'></span>
                        <span v-else style='color:red '>Error</span>
                    </template>
                    
                </el-table-column>
              </el-table>
回答
編輯回答
茍活

不要用 :key="item",應(yīng)該用key為一個唯一的值,這樣會使vue更好的重用dom,減少重繪,可能會解決你的卡頓問題。

2017年10月7日 20:39