elementuiのel-popoverが正常に表示されません

要件:フロントエンドの日常開発において、テーブルの操作欄について、ボタンをクリックした際にプロンプ​​トボックスが表示され、誤ってタッチしたり再確認(削除など)をしないように注意を促すケースがよくあります。これは、el-popover がよく使われます。

問題: しかし、el-popover はこの v-model 双方向バインディングを使用する必要がありますが、公式ドキュメントの例に従って el-table に el-popover を直接記述すると、正常に表示できないプロンプト ボックスが表示されます。私の理解は双方向の拘束力があるはずですが、矛盾があるはずです。

解決策: ref を el-popover に動的にバインドする

コード:

html:

js: 

これはel-popoverのOKボタン機能です。キャンセルも同様です。

 以下の図に示すように、elementui テーブルの各行操作で el-popover の通常の表示を実現できます。

 

 

おすすめ

転載: blog.csdn.net/m0_61676604/article/details/130554046