一、问题
发现在搜索框中无法输入内容。
二、原因分析
代码如下:
<el-form :inline="true" label-width="100px"> <el-form-item label="原药材名称:"> <el-input v-model.trim="listQuery.mmName" clearable/> </el-form-item> <el-form-item label="原药材编号:"> <el-input v-model.trim="listQuery.mmNo" clearable/> </el-form-item> <el-form-item label="种子批号:"> <el-input v-model.trim="listQuery.seedBatchNo" clearable/> </el-form-item> <el-form-item> <el-button type="primary" icon="el-icon-search" @click="getList">搜索</el-button> </el-form-item> </el-form>
script
data() { return { listQuery: { page: 1, limit: 20, seedingId: null, type: "not" } }; },
打开页面时执行的方法:
openDialog(seedingId) { this.dialogVisible = true; this.listQuery.seedingId = seedingId; this.listQuery.mmName = '' this.listQuery.mmNo = '' this.listQuery.seedBatchNo = '' this.getList(); },
由于在openDialog方法中增加了如下代码:
this.listQuery.mmName = '' this.listQuery.mmNo = '' this.listQuery.seedBatchNo = ''
添加上面的代码,才导致无法输入内容。如果不输入上面的代码,则不会出现这个问题。
三、解决办法
在data修改如下:
listQuery: { page: 1, limit: 20, seedingId: null, type: "not", mmName: null, mmNo: null, seedBatchNo: null }
具体为什么会出现这种情况,还未可知。