<el-input v-model="formLook.name" disabled="true" autocomplete="off" /> 报Invalid prop: type check failed for prop "disabled". Expected Boolean, got String with value "true".
时间: 2023-07-02 22:11:19 浏览: 436
这个错误是因为 `disabled` 属性期望的值是 Boolean 类型,而你传递的是字符串类型 "true"。请将 `disabled="true"` 改为 `:disabled="true"` 或者直接将 `disabled` 属性设为布尔值 `true`。修改后的代码如下所示:
```html
<el-input v-model="formLook.name" :disabled="true" autocomplete="off" />
```
或者
```html
<el-input v-model="formLook.name" disabled autocomplete="off" />
```
这样就可以避免这个错误了。
相关问题
<el-input v-model="formLook.name" disabled="true" autocomplete="off" /> 解决
这段代码中的 `disabled="true"` 属性将输入框设置为不可编辑状态,因此无法在输入框中输入内容。如果您想要输入内容,请将 `disabled` 属性删除或设置为 `false`。另外,`autocomplete="off"` 属性可以防止浏览器自动填充输入框,如果您需要浏览器自动填充,请将属性值改为 `on`。
<el-form-item label="联系人" prop="contactsList"> <el-button type="primary" link :disabled="dialogType === 'check'" @click="handleContactsInfo">添加</el-button> <el-table :data="infoForm.contactsList" border stripe size="small"> <el-table-column label="姓名" prop="ContactsName"> <template #default="{ row }"> <el-input :disabled="dialogType === 'check'" v-model.trim="row.ContactsName" maxlength="20" placeholder="请填写姓名" show-word-limit ></el-input> </template> </el-table-column> <el-table-column label="部门" prop="ContactsDepartment"> <template #default="{ row }"> <el-input :disabled="dialogType === 'check'" v-model.trim="row.ContactsDepartment" maxlength="20" show-word-limit placeholder="请填写部门" ></el-input> </template> </el-table-column> <el-table-column label="职务" prop="ContactsDuty"> <template #default="{ row }"> <el-input :disabled="dialogType === 'check'" v-model.trim="row.ContactsDuty" maxlength="20" show-word-limit placeholder="请填写职务" ></el-input> </template> </el-table-column> <el-table-column label="联系方式" prop="ContactNumber"> <template #default="{ row }"> <el-input :disabled="dialogType === 'check'" v-model.trim="row.ContactNumber" maxlength="50" show-word-limit placeholder="请填写联系方式" ></el-input> </template> </el-table-column> <el-table-column label="操作" width="56px"> <template #default="{ $index }"> <el-button type="primary" link size="small" :disabled="dialogType === 'check'" @click="handleRemove($index)" > 删除 </el-button> </template> </el-table-column> </el-table> </el-form-item> 该表单初始就有一个,且至少保留一个,对表单内姓名一栏进行必填校验
你可以通过在 el-input 元素的前面添加一个 el-form-item 元素,并设置 prop 属性为 "ContactsName",然后在 el-input 元素中添加一个 :rules 属性来进行必填校验。以下是示例代码:
```html
<el-table-column label="姓名" prop="ContactsName">
<template #default="{ row }">
<el-form-item prop="ContactsName" :rules="[{ required: true, message: '请填写姓名' }]">
<el-input
:disabled="dialogType === 'check'"
v-model.trim="row.ContactsName"
maxlength="20"
placeholder="请填写姓名"
show-word-limit
></el-input>
</el-form-item>
</template>
</el-table-column>
```
这样,当用户没有填写姓名时,表单会显示错误提示信息。
阅读全文