前端el-dialog
插槽scope.row相当于当前行的数据对象
<template slot-scope="scope"> {{scope.row}} </template>
<!-- 根据文件编号全局搜索-->
<div class="globle_search">
<a-input-search v-model="search_key" placeholder="请输入文件编号进行搜索" allowClear @search="search " />
</div>
<el-dialog :visible.sync="visible" title="文件路径:">
//绑定数据
<el-table border :data="search_path" >
<el-table-column type="index" label="序号" width="60"></el-table-column>
<el-table-column label="文件路径" min-width="200" >
//插槽显示数组value
<template slot-scope="scope">
{{scope.row}}
</template>
</el-table-column>
</el-table>
</el-dialog>
js部分
- data
data(){
return {
search_key:'',
search_path:[],
visible: false
}
- 方法
// 搜索事件
search(e){
if(!e){
console.log("请输入关键字")
return false;
this.visible =false;
}
console.log(e);
this.visible = true;
let root=this;
let url = "api/common/v1/get/file"
root.$axios.$post(url, {
"fileCode": e,
}).then(res=>{
if(res.rv==200){
//接收后端数组
root.search_path = [];
root.search_path.push(...res.data.filePath);
}else{
root.search_path='';
root.$message.error(res.msg);
}
})
.catch(err => {
root.$message.info("暂无数据");
});