极客观点
项目管理
HarmonyOS
问题描述
后台已经正常返回数据,前台并且已经读取到数据条数,但是页面数据显示的空白,页面F12不报错
问题出现的环境背景及自己尝试过哪些方法
没有找到网上相关的问题
相关代码
// 请把代码文本粘贴到下方（请勿用图片代替代码）
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml&...;>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="../../Resource/element-ui/theme-chalk/element-ui.css">
<script src="../../Scripts/jquery-3.3.1.js"></script>
<script src="../../Scripts/vue.js"></script>
<script src="../../Resource/element-ui/element-ui.js"></script>
<script src="../../Resource/lib/layui/layui.js"></script>
<script src="../../Scripts/framework.js"></script>
<script src="https://unpkg.com/axios/dist/...;></script>
</head>
<body>
<div id="app"><template>
<div style="width:100%;height:100%;">
<el-table :data="tableData.slice((currentPage-1)*pageSize,currentPage*pageSize)" :height="tableH" border style="width: 100%;"><%-- <el-table-column align="center" prop="date" label="日期" width="180"></el-table-column>--%>
<el-table-column align="center" prop="name" label="姓名" width="180"></el-table-column>
<el-table-column align="center" prop="address" label="地址"></el-table-column>
</el-table>
<!-- 分页器 -->
<el-pagination align='right' @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[1,5,10,20]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="tableData.length">
</el-pagination>
</div>
</template>
</div></body>
<script>
new Vue({
el: '#app',
data: {
tableH: $(window).height() - 50,
tableData: [],
currentPage: 1, // 当前页码
total: 20, // 总条数
pageSize: 10 // 每页的数据条数
},
methods: {
handleSizeChange(val) {
this.currentPage = 1;
this.pageSize = val;
},
handleCurrentChange(val) {
this.currentPage = val;
},
openFullScreen() {
this.fullscreenLoading = true;
setTimeout(() => {
this.fullscreenLoading = false;
}, 2000);
},
openFullScreen() {
const loading = this.$loading({
lock: true,
text: 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
setTimeout(() => {
loading.close();
}, 2000);
}
},
mounted:function() {
//this.openFullScreen();
let _this = this;
axios.get('../../Data/EntrySystem/Affiliated/Relations_Data.aspx', { params: { action: 'getJBxxList' } }).then(function (res) {
console.log(res.data);
_this.tableData = res.data
}).catch(function (error) {
console.log(error);
});
}});
</script>
</html>
