scenario

When clicking Delete in the El-Table, use El-PopConfirm to delete it twice. It works normally on the first page. When turning to another page and clicking El-PopConfirm again, the PopConfirm component is not displayed, and you cannot click “CONFIRM” and “Cancel”.

The solution

Ref =”popover-${scope.$index}” The scheme was found to be unworkable after preliminary attempts. (Element version: 2.13.2) Based on previous development and a preliminary understanding of the principles, it is possible that this scenario is due to key. This problem can be solved by adding key=”scope.row.id” to the table el-popconfirm. The key code is shown below

<template slot-scope="scope">
    <el-popconfirm title="Are you sure to cancel the order?" @onConfirm="cancel(scope.row)"  :key="scope.row.id">
        <span slot="reference" >Cancel the order</span>
    </el-popconfirm>
</template>
Copy the code

Caution: 1. The use of components must not be copied. 2. The method calls of this component are different in different versions. For example, events corresponding to 13.2

In version 15.6:



3. Since the development, there have been many other pits encountered by Element, which will not be described here.