Table checkbox problem when using elementUI

in the actual development, the table component of element is used, which includes checkbox. Found such a problem, every time you check a row of checkbox, click another button to display a dialog, the check state of the checkbox that just checked the row will disappear.

multipleSelection0checkboxmultipleSelection0bug

find a solution

I put a similar question on jsfiddle. After https://jsfiddle.net/rocky191.
selects a row, click Advanced search, and the selection state disappears. What"s going on? I"m in a hurry to solve the problem

Vue.js element-ui

Mar.05,2021

Table data data is calculated with calculation attributes. I'm not sure what's going on, though.

<el-table ref="czjlTable" v-loading="loading" :data="tableData" tooltip-effect="dark" stripe style="width: 100%" @selection-change="onSelectionChange">
            <el-table-column type="selection" width="55"></el-table-column>
            <el-table-column align="center" class-name="cursor" label="" show-overflow-tooltip width="120">
              <template slot-scope="scope">
                <span style="color:-sharp409eff;" @click="showJcInfo(scope.row)">{{scope.row.name}}</span>
              </template>
            </el-table-column>
            <el-table-column align="center" prop="hostName" label="" show-overflow-tooltip></el-table-column>
            <el-table-column align="center" prop="ip" label="IP" show-overflow-tooltip></el-table-column>
            <el-table-column align="center" prop="commandType" label="" show-overflow-tooltip></el-table-column>
            <el-table-column align="center" prop="startTime" label="" show-overflow-tooltip></el-table-column>
            <el-table-column align="center" prop="userTime" label="" show-overflow-tooltip></el-table-column>
            <el-table-column align="center" prop="username" label="" show-overflow-tooltip></el-table-column>
            <el-table-column align="center" class-name="cursor" label="" show-overflow-tooltip>
              <template slot-scope="scope">
                <span style="color:-sharp409eff;" @click="showExecute(scope.row)">{{scope.row.executeResult}}</span>
              </template>
            </el-table-column>
          </el-table>

computed: {
      tableData() {
        return this.czjlTableCon.slice((this.currentPage-1)*this.pageSize, this.currentPage*this.pageSize)
    }
  }

did you record the multipleSelection in the handleSelect method?

Previous: WeChat Mini Programs picture loading stutter

Next: Webpack access path settings?

This kind of tagsview point how to write the corresponding page when each one is closed, is it complicated?
Click the corresponding tag to close the corresponding page, how to write this, please < template > ...

Vue.js element-ui

Feb.27,2021
Problems encountered in using table controls of elementUI in vue-cli
Technical note: vue-cli+elementUI table control Business scenario description: 1.tabletable 2.end_date 3. 4.10>;10>ago solution: use the row-class-name attribute in the elementUI talbe control to determine whether to include the specified fiel...

Vue.js element-ui

Feb.28,2021
In el-dialog (display window), use Sortablejs to sort the table (el-table) in element without dragging.
such as headings, I want to sort the form by dragging within el-dialog. can be dragged if it is placed on the general surface. indicates that I have correctly introduced sortablejs into , but if I put the form on el-dialog, drag sorting will become ...

Vue.js element-ui element table sortable

Feb.28,2021
ElementUI Select component filter-method problem
there is a requirement that when Select selects a city, it needs fuzzy search, which supports not only Chinese, but also pinyin, acronyms and so on. The back end will give me the corresponding fields, but I find that using filter-method to pass in funct...

Javascript vue.js element-ui

Feb.28,2021
El-table custom column, how to transfer the row data and the data originally to be transmitted in the custom component?
as shown below, the change event was supposed to pass the numeric size in input. I want to post the scope.row data in this event, but I don t know how to send the two data at the same time. The following way of writing will send out the row data, but...

Vue.js element-ui

Feb.28,2021
How is the lower version of the element-ui custom theme initialized?
how is the lower version of the element-ui custom theme initialized? I use version 1.3.4 when et initialization variable files are installed, I am always prompted please install element-theme-chalk but this corresponds to the latest version, a...

Vue.js element-ui

Mar.01,2021
The problem of vue2.0+elementUi tree Control sending back data
treedivtree truepush iterate through the new array. Each item can be closed. How to uncheck the tree at the same time when closing? ...

Vue.js element-ui

Mar.01,2021
Element-ui table is the same as the official example code, but the fixed columns are highly misaligned?
have you encountered this situation? How to solve it? Why ...

Vue.js element-ui

Mar.01,2021
The animation effect of el-dialog popping up from the bottom
<transition name="fade"> <el-dialog :visible.sync="isShown" :append-to-body=true width="100%" > <div> 111111 < div>...

Vue.js element-ui

Mar.01,2021
Element date range selector datepicker can be changed to week
similar to this form ...

Vue.js element-ui

Mar.01,2021
Element, drop-down position is misplaced and reported to: PopperJS is not a constructor in vue-popper. "
when elementUI uses select, the drop-down position is misplaced and TypeError: PopperJS is not a constructor is reported in vue-popper. [Vue warn]: Error in event handler for "updatePopper": "TypeError: PopperJS is not a constructor&qu...

Vue.js element-ui element

Mar.02,2021
How to modify vue element el-tree defaultExpandedKeys dynamically?
I would like to ask the < el-tree > component in element-ui, default-checked-keys can be dynamically modified through setCheckedKeys, but the property defaultExpandedKeys does not have the corresponding function, how to modify dynamically? ...

Vue.js element-ui

Mar.02,2021
The layout problem of controlling cards based on the combination of vmurforforellicrow and el-col
use the component card provided by element-ui to display goods. After getting all the goods at the front end, all the goods are displayed by card external v-for loop output. wants to display four items in one line, but I don t know how to control the ...

Vue.js element-ui

Mar.02,2021
Can vue implement that the project is associated with a module, and will the module changes take effect immediately?
the 1.vue project has two parts, permissions and business. The business module is the startup entry of vue. You intend to package the permissions separately, and then the business module introduces this permission package in package.json. 2. Tried npm p...

Vue.js element-ui node.js

Mar.02,2021
How to render Virtual DOM dynamically by vue
I encountered a problem when using Element UI. I wanted to customize a component according to el-table, but I found it impossible to render the content of el-tabel-col dynamically. this is the official usage. Use slot to customize the content <temp...

Vue.js element-ui javascript

Mar.02,2021
Element-ui brings in components on demand
when you open the page after it is introduced on demand, it will prompt you for about 3 seconds console does not show throw error, black question mark face! ...

Webpack vue.js element-ui

Mar.02,2021
Width adjustment of element-ui NavMenu sidebar navigation
I would like to ask you how to adjust the width of the primary navigation and the secondary navigation. I try to set the width of .el-row to 100%. < el-aside > Thank you ~ ...

Vue.js element-ui

Mar.02,2021
The element-ui form right mouse button adds the .modifier modifier. Please tell me how to add it correctly.
Error in event handler for "row-contextmenu": "TypeError: $event.preventDefault is not a function" Please tell me how to add .client to row-contextmenu . ...

Iview javascript vue.js element-ui

Mar.02,2021
Element ui tabs tab bug
element uiui : add 1: I later commented out < component > < component > dynamic mount components, and there was no problem. But I don t see where there is bugmuri in my code. add 2: through debugging, I have located the problem now, because ...

Vue.js element-ui

Mar.02,2021
Element ui select cleanup option
how can select empty the selected data and display the original placeholder?? here is my code: ...

Front-end javascript vue.js element-ui

Mar.03,2021