1. Click the button to pop up a dialog and request the data to be displayed by table. There is a table and paging function in dialog. When dialog is opened, the check box in table is selected by default.
I did this, but there was no response.
/ buttons on the page
<el-button type="primary" **@click="addCcObject"**></el-button>
addCcObject(){
this.CCdialog = true;//
this.doCcData()//table
},//
<el-dialog title="" :visible.sync="CCdialog" **@open="showCcDialog"**>
<div style="margin:15px 0">
<el-input v-model="CCinputValue" placeholder="" style="width: 200px" clearable></el-input>
<el-button type="primary" @click="ccsearchBtn"></el-button>
</div>
<el-table :data="ccData" ref="ccData" @selection-change="handleSelectionChange" border>
<el-table-column type="selection" width="55">
</el-table-column>
<el-table-column property="caption" label=""></el-table-column>
</el-table>
<div style="margin:15px 0">
<el-pagination
background
layout="prev, pager, next"
:page-size="pageSize"
:current-page.sync="currentPage"
@current-change="currentChange"
:total="count">
</el-pagination>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="CCdialog = false"> </el-button>
<el-button type="primary" @click="ccOk"> </el-button>
</div>
</el-dialog>
//
showCcDialog(){
this.$nextTick(() => {
let selected = this.data_cc//
selected.forEach(i => {
this.$refs.ccData.toggleRowSelection(this.ccData.find(d => d.id === i.id), true) //
})
})
},showCcDialog(){
this.$nextTick(() => {
let selected = this.data_cc//
selected.forEach(i => {
//this.$refs.ccData.toggleRowSelection(this.ccData[2], true) //
//this.$refs.ccData.toggleRowSelection(this.ccData.find(d => d.id === i.id), true) //
this.$refs.ccData.toggleRowSelection(this.ccData.find(d => d.id === i.id), true) //
})
})
},