This commit is contained in:
216
node_modules/@dcloudio/uni-components/lib/page-meta/page-meta.vue
generated
vendored
Normal file
216
node_modules/@dcloudio/uni-components/lib/page-meta/page-meta.vue
generated
vendored
Normal file
@@ -0,0 +1,216 @@
|
||||
<template>
|
||||
<view style="display: none;">
|
||||
<slot />
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import { onMounted } from 'vue'
|
||||
// #ifndef H5
|
||||
import { onResize } from '@dcloudio/uni-app'
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
import { onWindowResize } from '@dcloudio/uni-h5'
|
||||
// #endif
|
||||
const scrolldoneEvent = {
|
||||
type: 'scrolldone',
|
||||
target: {
|
||||
id: '',
|
||||
offsetLeft: 0,
|
||||
offsetTop: 0,
|
||||
dataset: {}
|
||||
},
|
||||
currentTarget: {
|
||||
id: '',
|
||||
offsetLeft: 0,
|
||||
offsetTop: 0,
|
||||
dataset: {}
|
||||
},
|
||||
detail: {}
|
||||
}
|
||||
|
||||
export default {
|
||||
name: 'PageMeta',
|
||||
setup(props, { emit }) {
|
||||
// #ifndef H5
|
||||
onResize((evt) => {
|
||||
emit('resize', evt)
|
||||
})
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
onMounted(() => {
|
||||
onWindowResize(evt => {
|
||||
emit('resize', evt)
|
||||
})
|
||||
})
|
||||
// #endif
|
||||
|
||||
// let currentInstance = getCurrentInstance()
|
||||
// let proxy = currentInstance.proxy
|
||||
// onPageScroll((evt) => {
|
||||
// if (proxy._invokePageScrollToFlag === true && evt.scrollTop === proxy._invokeScrollTop) {
|
||||
// proxy._invokePageScrollToFlag = false
|
||||
// emit('scrolldone', scrolldoneEvent)
|
||||
// }
|
||||
// })
|
||||
},
|
||||
props: {
|
||||
backgroundTextStyle: {
|
||||
type: String,
|
||||
default: 'dark',
|
||||
validator (value) {
|
||||
return ['dark', 'light'].indexOf(value) !== -1
|
||||
}
|
||||
},
|
||||
backgroundColor: {
|
||||
type: String,
|
||||
default: '#ffffff'
|
||||
},
|
||||
backgroundColorTop: {
|
||||
type: String,
|
||||
default: '#ffffff'
|
||||
},
|
||||
backgroundColorBottom: {
|
||||
type: String,
|
||||
default: '#ffffff'
|
||||
},
|
||||
scrollTop: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
scrollDuration: {
|
||||
type: Number,
|
||||
default: 300
|
||||
},
|
||||
pageStyle: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
enablePullDownRefresh: {
|
||||
type: [Boolean, String],
|
||||
default: false
|
||||
},
|
||||
rootFontSize: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
created () {
|
||||
const pages = getCurrentPages()
|
||||
const currentPage = pages[pages.length - 1]
|
||||
this.$pageVm = currentPage.$vm || currentPage
|
||||
// #ifdef APP-PLUS
|
||||
this._currentWebview = currentPage.$getAppWebview()
|
||||
if (this.enablePullDownRefresh) {
|
||||
this.setPullDownRefresh(this._currentWebview, true)
|
||||
}
|
||||
this.$watch('enablePullDownRefresh', (val) => {
|
||||
this.setPullDownRefresh(this._currentWebview, val)
|
||||
})
|
||||
// #endif
|
||||
|
||||
// props
|
||||
|
||||
this.$watch('backgroundTextStyle', () => {
|
||||
this.setBackgroundTextStyle()
|
||||
})
|
||||
this.$watch(() => [
|
||||
this.rootFontSize,
|
||||
this.pageStyle
|
||||
], () => {
|
||||
this.setPageMeta(currentPage.$page.id)
|
||||
})
|
||||
this.$watch(() => [
|
||||
this.backgroundColor,
|
||||
this.backgroundColorTop,
|
||||
this.backgroundColorBottom
|
||||
], () => {
|
||||
this.setBackgroundColor()
|
||||
})
|
||||
this.$watch(() => [
|
||||
this.scrollTop,
|
||||
this.scrollDuration
|
||||
], () => {
|
||||
this.pageScrollTo()
|
||||
})
|
||||
|
||||
// this._invokeScrollTop = -1
|
||||
// this._invokePageScrollToFlag = false
|
||||
},
|
||||
beforeMount () {
|
||||
this.setBackgroundColor()
|
||||
if (this.rootFontSize || this.pageStyle) {
|
||||
this.setPageMeta()
|
||||
}
|
||||
this.backgroundTextStyle && this.setBackgroundTextStyle()
|
||||
},
|
||||
mounted() {
|
||||
this.scrollTop && this.pageScrollTo()
|
||||
},
|
||||
// #ifdef H5
|
||||
activated () {
|
||||
this.setPageMeta()
|
||||
},
|
||||
// #endif
|
||||
methods: {
|
||||
setPullDownRefresh (webview, enabled) {
|
||||
webview.setStyle({
|
||||
pullToRefresh: {
|
||||
support: enabled,
|
||||
style: plus.os.name === 'Android' ? 'circle' : 'default'
|
||||
}
|
||||
})
|
||||
},
|
||||
setPageMeta (pageId) {
|
||||
// h5 和 app-plus 设置 rootFontSize
|
||||
// #ifdef H5 || APP-PLUS
|
||||
this.$nextTick(() => {
|
||||
uni.setPageMeta({
|
||||
pageStyle: this.pageStyle,
|
||||
rootFontSize: this.rootFontSize,
|
||||
pageId
|
||||
})
|
||||
})
|
||||
// #endif
|
||||
},
|
||||
setBackgroundTextStyle () {
|
||||
// TODO h5 app-plus 暂不支持
|
||||
// #ifdef MP
|
||||
uni.setBackgroundTextStyle && uni.setBackgroundTextStyle({
|
||||
textStyle: this.backgroundTextStyle
|
||||
})
|
||||
// #endif
|
||||
},
|
||||
setBackgroundColor () {
|
||||
// TODO h5 app-plus 暂不支持
|
||||
// #ifdef MP
|
||||
uni.setBackgroundColor && uni.setBackgroundColor({
|
||||
backgroundColor: this.backgroundColor,
|
||||
backgroundColorTop: this.backgroundColorTop,
|
||||
backgroundColorBottom: this.backgroundColorBottom
|
||||
})
|
||||
// #endif
|
||||
},
|
||||
pageScrollTo () {
|
||||
let scrollTop = String(this.scrollTop)
|
||||
if (scrollTop.indexOf('rpx') !== -1) {
|
||||
scrollTop = uni.upx2px(scrollTop.replace('rpx', ''))
|
||||
}
|
||||
scrollTop = parseFloat(scrollTop)
|
||||
if (isNaN(scrollTop)) {
|
||||
return
|
||||
}
|
||||
|
||||
// this._invokeScrollTop = scrollTop
|
||||
|
||||
uni.pageScrollTo({
|
||||
scrollTop,
|
||||
duration: this.scrollDuration,
|
||||
success: () => {
|
||||
//this._invokePageScrollToFlag = true
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user