Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

更改pullrefresh 结束回调模式同时支持callback和promise #597

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

更改pullrefresh 结束回调模式同时支持callback和promise #597

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions .babelrc
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
{
"presets": [
["es2015"]
]
["env","stage-2"]
],
"plugins": ["transform-runtime"]
}
2 changes: 2 additions & 0 deletions example/main.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,7 @@ import CheckList from './routers/checklist.vue';
import Search from './routers/search.vue';
import ScrollNav from './routers/scrollnav.vue';
import Preview from './routers/preview.vue';
import PullRefresh from './routers/pullRefresh.vue';

import App from './app.vue';

Expand Down Expand Up @@ -107,6 +108,7 @@ const router = new VueRouter({
{path: '/search', name: 'search', component: Search},
{path: '/scrollnav', name: 'scrollnav', component: ScrollNav},
{path: '/preview', name: 'preview', component: Preview},
{path: '/pullRefresh', name: 'pullRefresh', component: PullRefresh},
]
});

Expand Down
1 change: 1 addition & 0 deletions example/routers/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,7 @@
{icon: 'demo-icons-scrollnav', name: 'ScrollNav', link: '/scrollnav'},
{icon: 'demo-icons-scrolltab', name: 'ScrollTab', link: '/scrolltab'},
{icon: 'demo-icons-preview', name: 'Preview', link: '/preview'},
{icon: 'demo-icons-preview', name: 'PullRefresh', link: '/pullRefresh'},
]
}
}
Expand Down
134 changes: 134 additions & 0 deletions example/routers/pullRefresh.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,134 @@
<template>
<yd-pullrefresh :callback="type==0?loadListCallback:loadList" ref="pullrefreshDemo">

<yd-list theme="4">
<yd-list-item v-for="item, key in list" :key="key">
<img slot="img" :src="item.img">
<span slot="title">{{item.title}}</span>
<yd-list-other slot="other">
<div>
<span class="list-price"><em>¥</em>{{item.marketprice}}</span>
<span class="list-del-price">¥{{item.productprice}}</span>
</div>
<div>content</div>
</yd-list-other>
</yd-list-item>
</yd-list>
<div class="tab-btn">
<button :class='{active:type==1}' @click="typeChange(1)">Promise</button>
<button :class='{active:type==0}' @click="typeChange(0)">Callback</button>
</div>
</yd-pullrefresh>
</template>
<style>
.tab-btn{
position: fixed;
bottom: 10px;
right:10px;
z-index: 100;
}
.tab-btn>button{
padding: 10px 15px;
border: none;
background-color:#7cc9ff ;
color:#ffffff;
box-shadow:0 0 5px 2px #B7D0E1;
}
.tab-btn>button.active{
background-color: #e95a4e;
}
</style>
<script type="text/babel">
export default {
data() {
return {
type:0,
page: 1,
list: []
}
},
mounted(){
this.init();
},
methods: {
init(){
this.$set(this,'page',1);
this.$set(this,'list',[
{
img: "http://img1.shikee.com/try/2016/06/23/14381920926024616259.jpg",
title: "标题标题标题标题标题",
marketprice: 56.23,
productprice: 89.36
},
{
img: "http://img1.shikee.com/try/2016/06/21/10172020923917672923.jpg",
title: "骆驼男装2016夏装男士短袖T恤 圆领衣服 印花男装体恤 半袖打底衫",
marketprice: 56.23,
productprice: 89.36
},
{
img: "http://img1.shikee.com/try/2016/06/23/15395220917905380014.jpg",
title: "条纹短袖T恤男士韩版衣服大码潮流男装夏季圆领体恤2016新款半袖",
marketprice: 56.23,
productprice: 89.36
},
{
img: "http://img1.shikee.com/try/2016/06/25/14244120933639105658.jpg",
title: "夏季青少年衣服男生潮牌t恤 男士 夏秋学生 日系棉短袖半袖男小衫",
marketprice: 56.23,
productprice: 89.36
},
{
img: "http://img1.shikee.com/try/2016/06/26/12365720933909085511.jpg",
title: "2016夏装新款时尚潮流短袖T恤男纯棉V领日系青少年韩版夏季上衣服",
marketprice: 56.23,
productprice: 89.36
},
{
img: "http://img1.shikee.com/try/2016/06/19/09430120929215230041.jpg",
title: "男装衣服男夏t恤 男士短袖t恤圆领夏季潮牌宽松原宿风半截袖男",
marketprice: 56.23,
productprice: 89.36
}
])
},
typeChange(type){
this.init();
this.$set(this,'type',type);
},
async loadList() {
const url = 'http://list.ydui.org/getdata.php';
console.log(this.page);
let response = await this.$http.jsonp(url, {params: {type: 'pulldown', page: this.page}});
const _list = response.body;

this.list = [..._list, ...this.list];

this.$dialog.toast({
mes: _list.length > 0 ? '为您更新了' + _list.length + '条内容' : '已是最新内容'
});

this.page++;

return true
},
loadListCallback() {
const url = 'http://list.ydui.org/getdata.php';
console.log(this.page);
this.$http.jsonp(url, {params: {type: 'pulldown', page: this.page}}).then((response)=>{
const _list = response.body;

this.list = [..._list, ...this.list];

this.$dialog.toast({
mes: _list.length > 0 ? '为您更新了' + _list.length + '条内容' : '已是最新内容'
});

this.page++;

this.$refs.pullrefreshDemo.$emit('ydui.pullrefresh.finishLoad');
});
}
}
}
</script>
3 changes: 3 additions & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,10 @@
"autoprefixer": "^6.6.1",
"babel-core": "^6.21.0",
"babel-loader": "^6.2.10",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-env": "^1.7.0",
"babel-preset-es2015": "^6.18.0",
"babel-preset-stage-2": "^6.24.1",
"css-loader": "^0.26.1",
"extract-text-webpack-plugin": "^1.0.1",
"file-loader": "^0.10.1",
Expand Down
10 changes: 8 additions & 2 deletions src/components/pullrefresh/src/pullrefresh.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -218,9 +218,15 @@

this.resetParams();
},
triggerLoad() {
async triggerLoad() {
this.touches.loading = true;
this.callback && this.callback();
var fn = this.callback&&this.callback();
if(fn&&fn.then&&typeof fn.then =='function'){
let ser = await fn;
if(ser){
this.resetParams();
}
}
},
resetParams() {
this.dragTip.translate = 0;
Expand Down