关于vue.js:vue-element-dialog弹框-表单新增后再点击新增表单无法重置问题

方才为了解决这问题，百度了一大圈，好几种都不失效，亲测无效的办法如下：
思路：在 dialog 关上的时候重置表单的值。
故在 dialog 中增加 open 办法，如下：

<!-- 新增弹框 -->

 <el-dialog title="新增 sql" :visible.sync="dialogFormVisible" @open="resetForm('addForm')">

     <el-form ref="addForm" :model= "addForm" :inline="true" @keyup.enter.native="handelAddConfirm()">

         <el-form-item label="sql 名称" prop="sqlName">

            <el-input v-model="addForm.sqlName" autocomplete="off"></el-input>

         </el-form-item>

         <el-form-item label="指标数据库、表名称" prop="tableId">

         <div class="cascaderBox">

             <el-cascader

             size="mini"

             v-model="addForm.tableId"

             :options="cascaderOptionsLevel2"

             :props="optionProps"

             filterable

             collapse-tags

             clearable

             @change="handleChange"

             ></el-cascader>

         </div>

         </el-form-item>

     </el-form>

     <div slot="footer" class="dialog-footer">

         <el-button @click="dialogFormVisible = false"> 取 消 </el-button>

         <el-button type="primary" @click="handelAddConfirm"> 确 定 </el-button>

     </div>

 </el-dialog>

而后在 method 中增加 resetForm 办法：

// 点击新增按钮 重置表单

resetForm(formName) {if (this.$refs[formName]!==undefined) {this.$refs[formName].resetFields();}

},