drip-public/iview
6
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Scroll add local loading-text

Browse source
This commit is contained in:
梁灏 2017-10-16 20:41:13 +08:00
parent 109465d3c5
commit 78b46fa619
2 changed files with 14 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
examples/routers/scroll.vue
View file

@ -1,5 +1,5 @@
<template> <template>
<Scroll :on-reach-top="loadData" loading-text="L-o-a-d-i-n-g..."> <Scroll :on-reach-edge="loadData">
<section v-for="item in list"> <section v-for="item in list">
<div class="city"> <div class="city">
<p>{{ item }}</p> <p>{{ item }}</p>

19
src/components/scroll/scroll.vue
View file

@ -9,13 +9,13 @@
ref="scrollContainer" ref="scrollContainer"
> >
<div :class="loaderClasses" :style="{paddingTop: wrapperPadding.paddingTop}" ref="toploader"> <div :class="loaderClasses" :style="{paddingTop: wrapperPadding.paddingTop}" ref="toploader">
<loader :text="loadingText" :active="showTopLoader"></loader> <loader :text="localeLoadingText" :active="showTopLoader"></loader>
</div> </div>
<div :class="slotContainerClasses" ref="scrollContent"> <div :class="slotContainerClasses" ref="scrollContent">
<slot></slot> <slot></slot>
</div> </div>
<div :class="loaderClasses" :style="{paddingBottom: wrapperPadding.paddingBottom}" ref="bottomLoader"> <div :class="loaderClasses" :style="{paddingBottom: wrapperPadding.paddingBottom}" ref="bottomLoader">
<loader :text="loadingText" :active="showBottomLoader"></loader> <loader :text="localeLoadingText" :active="showBottomLoader"></loader>
</div> </div>
</div> </div>
</div> </div>
@ -24,6 +24,7 @@
import throttle from 'lodash.throttle'; import throttle from 'lodash.throttle';
import loader from './loading-component.vue'; import loader from './loading-component.vue';
import { on, off } from '../../utils/dom'; import { on, off } from '../../utils/dom';
import Locale from '../../mixins/locale';
const prefixCls = 'ivu-scroll'; const prefixCls = 'ivu-scroll';
const dragConfig = { const dragConfig = {
@ -35,7 +36,7 @@
export default { export default {
name: 'Scroll', name: 'Scroll',
mixins: [], mixins: [ Locale ],
components: {loader}, components: {loader},
props: { props: {
height: { height: {
@ -52,8 +53,7 @@
type: Function type: Function
}, },
loadingText: { loadingText: {
type: String, type: String
default: ''
} }
}, },
data() { data() {
@ -98,7 +98,14 @@
paddingTop: this.topRubberPadding + 'px', paddingTop: this.topRubberPadding + 'px',
paddingBottom: this.bottomRubberPadding + 'px' paddingBottom: this.bottomRubberPadding + 'px'
}; };
} },
localeLoadingText () {
if (this.loadingText === undefined) {
return this.t('i.select.loading');
} else {
return this.loadingText;
}
},
}, },
methods: { methods: {
// just to improve feeling of loading and avoid scroll trailing events fired by the browser // just to improve feeling of loading and avoid scroll trailing events fired by the browser