template里面要做数据渲染,但是数据还没有出来
<el-dialog title="企业详情" :visible.sync="showEditPayment" @close="closeDialog" v-if="detail">
<el-tabs type="border-card">
<el-tab-pane label="客户信息">
<el-row>
<el-col class="grid-item" :sm="24" :md="12">
<el-col :span="8"><div class="grid-content grid-content-title">客户ID</div></el-col>
<el-col :span="16">
<div class="grid-content" >{{ detail.entId }}</div>
</el-col>
</el-col>
<el-col class="grid-item" :sm="24" :md="12">
<el-col :span="8"><div class="grid-content grid-content-title">客户名</div></el-col>
<el-col :span="16">
<div class="grid-content" >{{ detail.name }}</div>
</el-col>
</el-col>
<el-col class="grid-item" :sm="24" :md="12">
<el-col :span="8"><div class="grid-content grid-content-title">管理员</div></el-col>
<el-col :span="16">
<div class="grid-content" >{{ detail.contact }}</div>
</el-col>
</el-col>
<el-col class="grid-item" :sm="24" :md="12">
<el-col :span="8"><div class="grid-content grid-content-title">联系方式</div></el-col>
<el-col :span="16">
<div class="grid-content" >{{ detail.contactPhone }}</div>
</el-col>
</el-col>
<el-col class="grid-item" :sm="24" :md="12">
<el-col :span="8"><div class="grid-content grid-content-title">客户类型</div></el-col>
<el-col :span="16">
<div class="grid-content" >{{ detail.type === 'PERSON' ? '个人' : '企业'}}</div>
</el-col>
</el-col>
<el-col class="grid-item" :sm="24" :md="12">
<el-col :span="8"><div class="grid-content grid-content-title">简介</div></el-col>
<el-col :span="16">
<div class="grid-content" >{{ detail.intro }}</div>
</el-col>
</el-col>
<el-col class="grid-item" :sm="24" :md="12">
<el-col :span="8"><div class="grid-content grid-content-title">认证状态</div></el-col>
<el-col :span="16">
<div class="grid-content" >{{ verifyStatusMap[detail.verifyStatus] }}</div>
</el-col>
</el-col>
<el-col class="grid-item" :sm="24" :md="12">
<el-col :span="8"><div class="grid-content grid-content-title">认证备注</div></el-col>
<el-col :span="16">
<div class="grid-content">{{ detail.verifyResult }}</div>
</el-col>
</el-col>
<el-col class="grid-item" :sm="24" :md="12">
<el-col :span="8"><div class="grid-content grid-content-title">申请认证时间</div></el-col>
<el-col :span="16">
<div class="grid-content">{{ detail.applyVerifyTime }}</div>
</el-col>
</el-col>
<el-col class="grid-item" :sm="24" :md="12">
<el-col :span="8"><div class="grid-content grid-content-title">最后更新时间</div></el-col>
<el-col :span="16">
<div class="grid-content">{{ detail.updatedAt }}</div>
</el-col>
</el-col>
<el-col class="grid-item" :sm="24" :md="12">
<el-col :span="8"><div class="grid-content grid-content-title">专属顾问</div></el-col>
<el-col :span="16">
<div class="grid-content" >{{ detail.adviserName }}</div>
</el-col>
</el-col>
<el-col class="grid-item" :sm="24" :md="12">
<el-col :span="8"><div class="grid-content grid-content-title">专属顾问号码</div></el-col>
<el-col :span="16">
<div class="grid-content" >{{ detail.adviserPhone }}</div>
</el-col>
</el-col>
</el-row>
</el-tab-pane>
<el-tab-pane label="账户信息">
<div style="margin-bottom: 10px;">账户基本信息</div>
<el-row v-if="account">
<el-col class="grid-item" :sm="24" :md="12">
<el-col :span="10"><div class="grid-content grid-content-title">乐币(枚)</div></el-col>
<el-col :span="14">
<div class="grid-content">{{ account.integralBalance }}</div>
</el-col>
</el-col>
<el-col class="grid-item" :sm="24" :md="12">
<el-col :span="10"><div class="grid-content grid-content-title">余额(元)</div></el-col>
<el-col :span="14">
<div class="grid-content">{{ account.balance | filterMoney }}</div>
</el-col>
</el-col>
</el-row>
<div style="margin-top:12px; margin-bottom: 10px;">账户变更记录</div>
<el-table
:data="recordList"
border
v-loading="recordLoading"
element-loading-text="拼命加载中">
<el-table-column
min-width="130"
align="center"
label="编号"
prop="acctRecordId">
</el-table-column>
<el-table-column
min-width="120"
align="center"
label="时间"
prop="createdAt">
<template scope="scope">
{{ filters.formatTime(scope.row.createdAt) }}
</template>
</el-table-column>
<el-table-column
min-width="120"
align="center"
label="数量"
prop="amount">
<template scope="scope">
<span v-if="scope.row.subAcctType === 'BASE'">{{ scope.row.amount | filterMoney }}</span>
<span v-else>{{ scope.row.amount }}</span>
</template>
</el-table-column>
<el-table-column
min-width="60"
align="center"
label="单位"
prop="unit">
<template scope="scope">
<span v-if="scope.row.subAcctType === 'BASE'">元</span>
<span v-if="scope.row.subAcctType === 'RED_PACKET'">个</span>
<span v-if="scope.row.subAcctType === 'INTEGRAL_BASE'">枚</span>
</template>
</el-table-column>
<el-table-column
min-width="110"
align="center"
label="备注"
prop="remark">
</el-table-column>
<el-table-column
min-width="120"
align="center"
label="交易类型"
prop="transactionName">
</el-table-column>
</el-table>
<div class="block" style="float: right; margin: 10px;" v-if="recordList.length">
<el-pagination
layout="total, prev, pager, next, jumper"
:current-page="recordPage"
@current-change="handleRecordChange"
:total="totalElements">
</el-pagination>
</div>
</el-tab-pane>
</el-tabs>
<div slot="footer" class="dialog-footer">
<el-button @click="showEditPayment = false">取 消</el-button>
<el-button type="primary" @click="postEdit">确 定</el-button>
</div>
</el-dialog>
在数据没有出来之前可以在 <el-dialog title="企业详情" :visible.sync="showEditPayment" @close="closeDialog" v-if="detail">加上一个v-if,这样就不会报detial undefine的情况
template里面要做数据渲染,但是数据还没有出来的更多相关文章
- template.js 数据渲染引擎
template.js 数据渲染引擎 template.js是一款JavaScript模板引擎,用来渲染页面的. 原理:提前将Html代码放进编写模板 <script id="tpl& ...
- 浅入深出Vue：数据渲染
今天来正式开始 vue的学习,首当其冲的当然是数据的渲染.毕竟数据就是拿来看的,看看如果使用 vue来展示数据. 为什么渲染 俗话说 "人靠衣装马靠鞍", 那咱们的代码就是得靠 U ...
- Electron-vue实战（二）— 请求Mock数据渲染页面
Electron-vue实战(二)— 请求Mock数据渲染页面 作者:狐狸家的鱼 本文链接 GitHub:sueRimn 一.环境搭建 1.安装Mock.js 如果仅仅用作脱离后台的模拟数据,就安装在 ...
- 前端数据渲染及mustache模板引擎的简单实现
早期数据渲染的几种方式 在模板引擎没有诞生之前,为了用JS把数据渲染到页面上,诞生了一系列数据渲染的方式. 最最基础的,莫过于直接使用DOM接口创建所有节点. <div id="roo ...
- CSharpGL(8)使用3D纹理渲染体数据 (Volume Rendering) 初探
CSharpGL(8)使用3D纹理渲染体数据 (Volume Rendering) 初探 2016-08-13 由于CSharpGL一直在更新,现在这个教程已经不适用最新的代码了.CSharpGL源码 ...
- easyUI datagrid 多行多列数据渲染异常缓慢原因以及解决方法
原因 最近,在优化之前公司帮联想(外包)做的一个老的后台管理系统,由于项目是基于easy UI框架,页面是后台用jsp实现的,再加上在公司推行前后端分离的实践,大部分项目都基于vue采用前后端分离去实 ...
- vue轮播，vue-awesome-swiper动态数据渲染，loop无效，轮循无效
解决办法:在渲染数组数据前.判断是否为空 v-if="slideList.length>1" <template> <div class="ban ...
- vue2.* 目录结构分析 数据绑定 循环渲染数据 数据渲染02
一.目录 结构分析 node_modules:项目依赖文件(也可以说是模块) src:开发时所用的资源 assets:静态资源文件 App.vue:根组件(最基础的公共页面) main.js:实例化v ...
- React.js 小书 Lesson13 - 渲染列表数据
作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson13 转载请注明出处,保留原文链接和作者信息. 列表数据在前端非常常见,我们经常要处理这种类型 ...
随机推荐
- php后台实现页面跳转的方法-转载
地址:http://blog.csdn.net/abandonship/article/details/6459104 其中方法三的js代码在tp框架使用存在故障,一个是需要把代码写在一起(可能也不需 ...
- Flask初识之安装及HelloWord程序
Python 现阶段三大主流Web框架 Django Tornado Flask 对比 1.Django 主要特点是大而全,集成了很多组件,例如: Models Admin Form 等等, 不管你用 ...
- JavaScript:将key和value不带双引号的JSON字符串转换成JSON对象的方法
遇到相关的问题,花了两天的时间来解决,深感来之不易,所以做如下的总结,希望遇到此问题的码农能更快的找到解决办法! var jsonArr= [{col:TO_CHAR(HZRQ,'YYYYMM'),t ...
- UVA572 (并查集解法)
紫书第六章的题,用并查集重写一遍,果然还是书上给的dfs方法更简单...... 一开始用fa[i*m+j] != i*m+j 来判断是否访问过,虽然没想出来为什么WA,但是确实不如用vis稳 #inc ...
- mysql：[Err] 1068 - Multiple primary key defined
添加主键时,出现错误:[Err] 1068 - Multiple primary key defined #增加主键 ) not null; ; alter table my_test add pri ...
- 如何设置CentOS 7获取动态IP和静态IP
自动获取动态IP地址 1.输入“ip addr”并按回车键确定,发现无法获取IP(CentOS 7默认没有ifconfig命令),记录下网卡名称(本例中为ens33). 2.输入“cd /etc/sy ...
- 小程序~获取手机号getPhoneNumber提示该appid没有权限
处理思路 (1)小程序是不是企业主体 (2)有没有进行认证 (3)如果没有 是不可以获取用户手机号码的 .
- 《你们都是魔鬼吗》团队作业Beta冲刺---第一天
团队作业Beta冲刺 项目 内容 这个作业属于哪个课程 任课教师博客主页链接 这个作业的要求在哪里 作业链接地址 团队名称 你们都是魔鬼吗 作业学习目标 (1)掌握软件黑盒测试技术:(2)学会编制软件 ...
- scala 中的集合类
集合最重要的继承路线 —— Traversable -> Iterable -> Seq -> LinerSeq -> List Traversable 中的公有方法: 分类 ...
- 区别和认识.net四个判等方法
概要 本方介绍.net如何判断两个对象是否相等 .Net有四个判等函数 1)Object.ReferenceEquals 2)Object.Equals 3)对象实例的Equals 4)==操作符 这 ...