- 请问,要怎么设置才可以在内容高度低于容器高度可以取值?~
<template>
<div ref='wrapper'>
<slot></slot>
</div>
</template>
<script>
import BScroll from 'better-scroll'
export default {
props: {
probeType: {
type: Number,
default: 1
},
data: {
type: Array | Object,
default: null
},
pulldown: {
type: Boolean,
default: true
}
},
mounted () {
setTimeout(() => {
this._initScroll()
}, 20)
},
methods: {
_initScroll () {
if (!this.$refs.wrapper) {
return
}
this.scroll = new BScroll(this.$refs.wrapper, {
probeType: this.probeType,
click: this.click,
pulldown: this.pulldown
})
if (this.pulldown) {
this.scroll.on('touchEnd', (pos) => {
console.log(pos)
if (pos.y > 50) {
this.$emit('pulldown')
}
})
}
},
disable () {
this.scroll && this.scroll.disable()
},
enable () {
this.scroll && this.scroll.enable()
},
refresh () {
this.scroll && this.scroll.refresh()
},
scrollTo () {
this.scroll && this.scroll.scrollTo.apply(this.scroll, arguments)
},
scrollToElement () {
this.scroll && this.scroll.scrollToElement.apply(this.scroll, arguments)
}
},
watch: {
data () {
setTimeout(() => {
this.refresh()
}, this.refreshDelay)
}
}
}
</script>
<template>
<div>
<van-loading v-if="showLoading" type="spinner" color="#fff" size="50px"/>
<div class="charging useHeight">
<scroll class="scroll-wrapper">
<div class="chargeList">
<dl>
<dt>
<em>充电中</em>
<span>查看详情</span>
</dt>
<dd>
<div class="label">设备信息</div>
<div class="infor">这里是设备信息</div>
</dd>
<dd>
<div class="label">设备信息</div>
<div class="infor">这里是设备信息</div>
</dd>
<dd>
<div class="label">设备信息</div>
<div class="onOff">
<div><span class="green"/>开</div>
<div><span class="gray"/>关</div>
</div>
</dd>
</dl>
</div>
</scroll>
</div>
</div>
</template>
<script>
import scroll from 'module/scroll'
import vHeader from 'module/header'
export default {
name: 'charging',
components: {
vHeader,
scroll
},
methods: {
back () {
console.log(11)
}
}
}
</script>
<style lang="less" scoped>
@import '~style/variables.less';
@import './index.less';
</style>
