//ajax返回来数据,可以观测到,就是在页面上赋值不好使!
searchUrlList:function (currentPage) {
var self = this;
$.ajax({
type:"post",
data:{currentPage:currentPage},
url:"<%=searchUrlListAction%>",
success:function(result){
//此处使用 this.urlListInfo2 = result.urlsList;---------------------赋值不好用了
self.urlListInfo2 = result.urlsList;
$('div.dataTables_paginate_urlList').pageList({
prevText: '前一页',
nextText: '下一页',
recordText: '{0}页,{1}条记录',
totalCount: result.allRowNum,
goInputType: 'text',
showGoLink: false,
showPageRange: 5,
pageSize:${commonPageSize},
currentPage:self.currentPage,
renderPerCall: true,
clickCallback: function (currentPage) {
self.currentPage = currentPage;
mainVue.searchUrlList(currentPage);
}
});
$("#urlListInfo").attr("style","display:block;");
}
//ajax请求失败时的处理
});
},
// 下面的 urlListInfo2 总是赋值不上,原因,上面没有写:var self = this;而是只用了this!
<div id="urlListInfo" style="display:none;">
<table class="table table-striped table-bordered table-hover">
<thead>
<tr>
<th>NO</th>
<th>域名</th>
<th>域名可用天数</th>
<th>服务器可用天数</th>
<th>服务器公网IP</th>
<th width="20%">操作</th>
</tr>
</thead>
<tbody>
<tr v-for="(method,index) in urlListInfo2" key="index">
<td style="vertical-align: middle">{{index+1+(currentPage-1)*10}}</td>
<td style="vertical-align: middle">{{method.url}}</td>
<td style="vertical-align: middle">{{method.url_time}}</td>
<td style="vertical-align: middle">{{method.server_time}}</td>
<td style="vertical-align: middle">{{method.public_ip}}</td>
<td class="center" style="vertical-align: middle">
<a href="javascript:void(0)" v-on:click="pUrlDetail(method)" class="btn btn-info btn-outline btn-sm">
<i class="fa fa-edit"></i>详情
</a>
<a href="javascript:void(0);" v-on:click="doDeletePUrl(method.sn)" class="btn btn-danger btn-outline btn-sm">
<i class="fa fa-times"></i>删除
</a>
</td>
</tr>
</tbody>
</table>
<div class="dataTables_paginate_urlList paging_simple_numbers"></div>
</div>