菜鸟一直在纠结这个写不写,因为不难,但是菜鸟老是容易忘记,虽然想想或者搜搜就可以马上写出来,但是感觉每次那样就太麻烦了,不如一股做气写了算了,后面遇见别的就再来补充!
文章目录
- table 表格自定义内容
- select 显示的是value
- upload 使用
table 表格自定义内容
<el-table-column label="操作" width="230"><template #default="scope"><el-button type="primary" size="small">详情</el-button><el-popconfirm :title="$t('deleteprompt')" @confirm="deleteEvent(scope.row)"><template #reference><el-button type="danger" size="small">删除</el-button></template></el-popconfirm><el-button type="primary" size="small" :disabled="scope.row.status == 0">分享</el-button></template>
</el-table-column>
select 显示的是value
之所以显示为 value 就是因为,你 v-model 所给的值,和 el-option 的 value 不一致,最常见的就是 0 和 ’0‘ 了
upload 使用
<el-upload class="upload-demo" ref="upload" action="#" :auto-upload="false" :limit="1" :on-change="onFun" :on-exceed="handleExceed" :on-remove="removeFun"><template #trigger><el-button type="primary">选择文件</el-button></template><el-button class="uploadtext" type="success" :disabled="uploaddisable" @click="submitUpload"> 上传 </el-button><span class="tip" @click="downloadFile('模板', downloadUrlArr[formdata.formType])"> 下载模板 </span><template #tip><div class="el-upload__tip text-red">* 只能上传excel文件</div></template>
</el-upload>
// 上传是否可用
let uploaddisable = ref(true);
// 获取el-upload元素,方便后面清空
const upload = ref();
// 提交使用
let fd = null;
// 上传事件
function onFun(file) {if (file.name.indexOf(".xls") > 0 || file.name.indexOf(".xlsx") > 0 || file.name.indexOf(".xlsm") > 0) {fd = new FormData();fd.append("file", file.raw); //传文件uploaddisable.value = false;} else {upload.value.clearFiles();// eslint-disable-next-lineElMessage({message: "请选择excel文件!",type: "error",});}
}
// 删除文件事件
function removeFun() {upload.value.clearFiles();uploaddisable.value = true;
}
// 提交第二个文件事件
const handleExceed = (files) => {// console.log(files);upload.value.clearFiles();const file = files[0];upload.value.handleStart(file);
};
// 提交事件 -》 这部分按逻辑自行更改
let sampleGroups = ref([]);
let envFactors = ref([]);
let objkeyArr = ref([]);
const submitUpload = () => {uploadFile({formId: id,},fd).then((res) => {if (res.code == 200) {// 解析后结果保存,用于提交表单,不能直接使用 sampleGroups = ,会让数据不是响应式sampleGroups.value = res.data.sampleGroups; // 样品分组表envFactors.value = res.data.envFactors; // 环境因子表showresult.value = true;for (let i in envFactors.value[0]) {if (i != "sampleAnalysisName") {objkeyArr.value.push(i);}}} else {// eslint-disable-next-lineElMessage({message: res.message,type: "error",});}}).catch((err) => {console.log(err);});
};