- 22
- 0
<html xmlns:th="http://www.thymeleaf.org">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<div th:include="/common/common::common"></div>
<head>
<meta content="text/html;charset=UTF-8" />
<link rel="stylesheet" th:href="@{/css/common/animate.min.css}">
<link rel="stylesheet" th:href="@{/css/common/nprogress.css}">
<link rel="stylesheet" th:href="@{/css/common/font-awesome.min.css}">
<link rel="stylesheet" th:href="@{/css/common/bootstrap.min.css}">
<link rel="stylesheet" th:href="@{/css/common/custom.min.css}">
<script th:src="@{/js/login.js}"></script>
</head>
<body class="nav-md">
<div class="container body">
<div class="main_container">
<div class="col-md-3 left_col">
<div class="left_col scroll-view">
<div th:include="/common/left::left"></div>
</div>
</div>
<div th:include="/common/header::header"></div>
<div class="right_col" role="main" style="min-height: 100%;"><br>
<div>
<i-table :columns="columns1" :data="historyData"></i-table>
<Page :total="dataCount" :page-size="pageSize" @on-change="changepage" show-sizer></Page>
</div>
</div>
</div>
</div>
</body>
</head>
<script>
var vue = new Vue({
el: '#app',
data (){
return {
//在脚本中,我们在表格中定义的数据和表头都需要在这里进行绑定,下面是一些假数据,其中Columns1中的title表示列明,key表示K-V中的标识
columns1: [
{
title: '用户名',
key: 'username'
},
{
title: '邮箱',
key: 'email'
},
{
title: '创建时间',
key: 'createTime'
},
{
title: '更新时间',
key: 'updateTime'
}
],
//接下来绑定数据,分别对应前面的列的key值来进行数据绑定
historyData: [],
// 初始化信息总条数
dataCount:0,
// 每页显示多少条
pageSize:10
};
},
methods: {
querytable : function(){
axios.get("/user/getUsers")//post也可以改成get,但需要对应服务端的请求方法
.then(function (response) {
// 保存取到的所有数据
this.dataCount = response.list.length;
// 初始化显示,小于每页显示条数,全显,大于每页显示条数,取前每页条数显示
if(response.list.length < this.pageSize){
this.historyData = response.list;
}else{
this.historyData = response.list.slice(0,this.pageSize);
}
})
.catch(function (error) {
alert(error);
});
},
changepage(index){
var _start = ( index - 1 ) * this.pageSize;
var _end = index * this.pageSize;
this.historyData = response.data.slice(_start,_end);
},
//当页面加载的时候执行
created () {
querytable();
}
}
});
</script>
</html>
为什么没加载 methods呢?data都走了
0
打赏
收藏
点击回答
- 共 0 条
- 全部回答
-
黒色ン诱惑灬 普通会员 1楼
Vue.js 加载问题通常与以下因素有关:
-
异步加载:Vue.js 支持异步加载,这可以提高应用程序的性能。当组件中的数据发生变化时,Vue.js 会自动重新加载该组件,而不是等待整个页面完全加载。
-
缓存:Vue.js 使用虚拟DOM 和 Vue Router 进行数据渲染。如果页面上的数据在渲染时被缓存,那么在下一次渲染时,Vue.js 可能会直接从缓存中获取数据,而不是重新加载页面。
-
图片加载:Vue.js 可以通过懒加载来优化图片加载。当图片加载不完全时,Vue.js 可以将它们保存在临时文件中,而不是直接加载整个图片。
-
服务器响应时间:如果服务器响应时间过长,Vue.js 可能会尝试重新加载页面,而不是等待服务器响应。这可能会导致页面加载速度变慢。
-
网络问题:如果网络连接不稳定,Vue.js 可能会尝试重新加载页面,而不是等待服务器响应。这可能会导致页面加载速度变慢。
如果你在使用 Vue.js 时遇到加载问题,你可以尝试以下步骤:
-
检查你的网络连接。
-
检查你的服务器响应时间。
-
如果使用的是懒加载,尝试优化图片加载。
-
如果使用的是异步加载,尝试提高Vue.js的性能。
-
如果你使用的是Vue Router,尝试优化路由配置。
-
更多回答
网站公告
- 扫一扫访问手机版
回答动态

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题函数计算不同地域的是不能用内网吧?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题在ARMS如何申请加入公测呀?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的,这个init方法在哪里进行添加?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器刚到期,是不是就不能再导出存档了呢?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了,怎么办?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了,怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了,是什么情况?预计能赚取 0积分收益
- 回到顶部
- 回到顶部

