vue3中setup用法与methods用法踩坑

最新推荐文章于 2024-08-02 20:26:31 发布

喵喵喵更多

最新推荐文章于 2024-08-02 20:26:31 发布

阅读量1.4k

点赞数

分类专栏：前端 html 文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/m0_67393827/article/details/123370433

版权

本文记录了在 Vue3 中使用 element-plus Dialog 的踩坑经历，对比分析了在 `methods()` 和 `setup()` 中调用 Dialog 的常见错误，包括在 `methods()` 中因拼写错误导致 Dialog 无法显示的问题，以及在 `setup()` 中使用双向绑定时需注意的 `ref` 和 `value` 的使用方法。

摘要由CSDN通过智能技术生成

vue3 使用element-plus Dialog踩坑记录之methods用法与setup用法

Element Dialog最原始的调用
1.在methods()中踩的坑
2.在setup()中踩的坑

Element Dialog最原始的调用

复制过来的代码可以直接把dialog弹出来

<template>
<el-button type="text" @click="dialogFormVisible = true">打开嵌套表单的 Dialog</el-button>
<el-dialog title="收货地址" v-model="dialogFormVisible">
  <template #footer>
    <span class="dialog-footer">
      <el-button @click="dialogFormVisible = false">取 消</el-button>
      <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>
    </span>
  </template>
&l