vue相关组件用法

npm install --force

<el-checkbox v-model="checkbox.checkModel" :label="index"
:disabled="checkbox.disabled.indexOf(index) >= 0"
style="padding-left: 10px">
</el-checkbox>
<el-table v-loading="tableQuery.loading" :data="tableData" ref="dataTable" :row-key="(row)=>{ return row.id}" @selection-change="handleSelectionChange">
<el-table-column type="selection" reserve-selection="true" />

<el-table-column label="格式化" :formatter="format" />

<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button icon="el-icon-search" title="查询" size="mini" plain @click="query(scope.row)" />
</template>
</el-table-column>

</el-table>

handleSelectionChange(val) {
this.multipleSelection = val;

}

query(row) {
this.$nextTick(() => {
this.$refs.dataTable.toggleRowSelection(self.tableData[index],true);
});

}

//格式化
format(row) {
let obj = this.arr.find((item) => {
return item.value === row.id;
});
if (typeof obj !== 'undefined'){
return obj.label;
}else {
return row.id;
}
}

mounted() {
window.addEventListener('message', this.handleMessage);
}

 

handleMessage() {
const data = event.data.data;
if (data.code === "edittable") {
this.parentviewmethods();
}

}

childview(row) {
window.parent.postMessage({
data: {
code: "edittable",
value: row
}
}, '*');
}

 

//文件上传

<el-form ref="form" :model="form" :rules="rules" label-width="80px">
  <el-form-item label="上传文件:" prop="file" size = 'small' label-width="80px">
  <el-upload action="#" ref="file" accept="image/*" list-type="picture" :on-change="changFile" :http-request="requestUpload" :file-list="fileList" :auto-upload="false">
    <el-button size="small" type="primary" icon="el-icon-upload">选取文件</el-button>
  </el-upload>
</el-form-item>
</el-form>

// 表单参数
form: {
  file:null
}

//覆盖默认的上传行为
requestUpload() {
},
changFile(file, fileList) {
  this.fileList = fileList
},
removeFile(file, fileList){
  this.fileList = fileList
},
handleExceed(file, fileList) {
  this.$message.warning(`当前限制最多选择 1 个文件`);
},

submitForm() {
  let data = new FormData();
  for (let i = 0; i < this.fileList.length; i++) {
    data.append('file', this.fileList[i].raw);
  }
  for(let key in this.form){
    if (this.form[key] !=null){
      data.append(key,this.form[key]);
    }
  }
  this.$refs["form"].validate(valid => {
});

posted @ 2022-03-03 10:06  hsyooy  阅读(29)  评论(0编辑  收藏  举报