vue3+elementPlus：el-drawer新增修改弹窗复用

原创

已于 2023-12-27 09:50:10 修改 · 1.9k 阅读

7 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #elementui #javascript #前端 #ecmascript

于 2023-12-27 09:49:11 首次发布

博客提及在el-drawer属性里设置:title属性和重置函数，还回顾上一篇文章，介绍uniapp项目中利用filters过滤器将时间格式化为特定格式，该过滤器与method、onLoad、data同层级。

在el-drawer的属性里设置:title属性，和重置函数

//html
 <!-- 弹窗  -->
  <el-drawer
    v-model="drawer"
    :title="title"
    :size="505"
    :direction="direction"
    :before-close="handleClose"
  >
    <el-form
      label-position="top"
      :inline="true"
      ref="ruleFormRef"
      size="default"
      :model="form.queryParams"
      class="RuleForm"
      :rules="rules"
      :label-position="labelPosition"
      status-icon
    >
      <el-form-item label="型号" prop="bearingModel">
        <el-input
          v-model="form.queryParams.bearingModel"
          placeholder="请添加型号"
          controls-position="right"
        />
      </el-form-item>
      <el-form-item label="供应商名称" prop="factoryName">
        <el-select
          v-model="form.queryParams.factoryName"
          placeholder="请选择供应商名称"
          clearable
        >
          <el-option
            v-for="