應用效果：

代碼：

<template>
......<el-form-item label="文件編號" label-position="right"><el-input v-model="qualityFileForm.fileNo" clearable :disabled="!props.isNew" /></el-form-item>
......<el-form-item label="附件" label-position="right"><el-input class="input-readonly" v-model="qualityFileForm.filePathname" readonly /></el-form-item>
......
</template><style scoped lang="scss">
// 設置等同于disabled的樣式效果，背景色 #f5f7fa，字體顏色 #c0c4cc
// 設置類名為 input-readonly 的元素的背景顏色
.input-readonly :deep(.el-input__wrapper) {background-color: #f5f7fa;
}
// 設置只讀的input的字體顏色，不使用類名，使用類屬性選擇器（.類名[屬性名]）
:deep(.el-input__inner[readonly]) {color: #c0c4cc;
}
</style>