请求接口返回的字段,渲染的时候需要拼接部分字符串,起初盲目for循环拼接,下班后回想起总感觉不对劲,果然,哈哈,vue变量字符串拼接是各种支持的呢
// 表格渲染,行数据单独处理 slot-scope="scope"
<el-table-column label="站点LOGO" width="180">
<template slot-scope="scope">
<!-- <img :src="'http://web.test.net/web/websiteimg/'+scope.row.icon+'.png'" width="80"> -->
<img :src="`http://web.test.net/web/websiteimg/${scope.row.icon}.png`" width="80">
</template>
</el-table-column>
弹框表单 当前页面进行新增、删除需要刷新,要不数据渲染不会变化,方法reload,其实和mounted执行的内容一样的(不太友好)
<el-dialog :title="subname" :visible.sync="dialogFormVisible">
<el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
<el-form-item label="用户名" prop="username" :rules="[
{ required: true, message: '请输入用户名', trigger: 'blur' },
]">
<el-input v-model="ruleForm.username"></el-input>
</el-form-item>
<el-form-item label="密码" prop="password" :rules="[
{ required: true, message: '请输入密码', trigger: 'blur' },
]">
<el-input v-model="ruleForm.password"></el-input>
</el-form-item>
<el-form-item label="手机号" prop="phone">
<el-input v-model.number="ruleForm.phone"></el-input>
</el-form-item>
<el-form-item>
<el-button v-if="isub" type="primary" @click="submitForm('ruleForm')">确 定</el-button>
<el-button v-else type="primary" :loading="true">请求处理中...</el-button>
<!-- <el-button @click="resetForm('ruleForm')">重置</el-button> -->
<el-button @click="resetForm('ruleForm')">取 消</el-button>
</el-form-item>
</el-form>
<div v-if="errmsg != ''">
<el-alert :title="errmsg" type="error" effect="dark">
</el-alert>
</div>
</el-dialog>
submitForm(formName) {
let that = this
that.$refs[formName].validate((valid) => {
if (valid) {
var basedata = {}
that.$ajax.post('/test/test/test', basedata)
.then(function(response) {
var res = response.data
if (response.data.code == 1) {
that.$message({
message: response.data.msg,
type: 'success'
});
that.reload()
} else if (response.data.code == 2) {
})
.catch(function(error) {
console.log(error);
})
} else {
console.log('error submit!!');
return false;
}
});
},
reload() {
this.loading = true
this.showcaccount()
}