vue是一种轻巧便捷的框架，那么如何进行对于数据加载的刷新呢？以下就是我对于vue.js数据加载的一点想法
vue是一种轻巧便捷的框架，那么如何进行对于数据加载的刷新呢？以下就是我对于vue.js数据加载的一点想法
源码：
<div style="height: 100%;overflow: auto"> <ul class="shop-brand-index"> 0"> <li> <div></div> </li> </ul> <div class="loading_wrap myload disn"> <p>加载中...</p> <i class="loading"></i> </div></div>
解析：
$(function() { var pageNum = 1; var pageSize = 6; vue = new Vue({ el: '#app', data: { items: [], pageNum: pageNum, pageSize: pageSize, rawItems: [], sitems:[] }, methods: { getList: function() { $.showLoading(); this.$http.get(store.list, { pageNum: pageNum, pageSize: pageSize }).then(function(result) { $.removeLoading(); this.sitems = result.data.data.items; }, function() { $.removeLoading(); $.showAlert({ 'title': '提示', 'content': "页面偷懒了~~", 'sure': this.close }); }) }, close: function() { history.go(-1); }, onScroll: function(event) { var offsetHeight = event.currentTarget.offsetHeight, scrollHeight = event.target.scrollHeight, scrollTop = event.target.scrollTop, scrollBottom = offsetHeight + scrollTop; if(scrollBottom == scrollHeight+10 ||scrollBottom == scrollHeight) { if(this.pageNum == Math.ceil(this.rawItems.length / this.pageSize)) { return } this.pageNum++; pageNum++; $(".myload").removeClass("disn"); vue.$http.get(store.list, { pageNum: pageNum, pageSize: pageSize }).then(function(result) { setTimeout(function() { $(".myload").addClass("disn"); vue.sitems = vue.sitems.concat(result.data.data.items); }, 2000) }, function() { $(".myload").addClass("disn"); }) } }, }, ready: function() { this.getLis<mark style="color:transparent">来4源gaodaimacom搞#代%码*网</mark>t(); for(var i = 0; i <= 1000; i++) { this.rawItems.push(i) } } }) })
以上所述是小编给大家介绍的vue.js加载新的内容(实例代码)，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对gaodaima搞代码网网站的支持！
以上就是vue.js加载新的内容(实例代码)的详细内容，更多请关注gaodaima搞代码网其它相关文章！
搞代码网（gaodaima.com）提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected]，我们会在看到邮件的第一时间内为您处理，或直接联系QQ：872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接：vue.js加载新的内容(实例代码)
转载请注明原文链接：vue.js加载新的内容(实例代码)
