408 行
12 KiB
Plaintext
408 行
12 KiB
Plaintext
<template>
|
|
<!-- #ifdef APP -->
|
|
<scroll-view class="page-scroll-view">
|
|
<!-- #endif -->
|
|
<view id="container">
|
|
<page-head title="getCurrentPages"></page-head>
|
|
<view class="uni-padding-wrap">
|
|
<button @click="_getCurrentPages">getCurrentPages</button>
|
|
<view v-if="data.pages.length" style="padding: 15px 0px">
|
|
<text>当前页面栈中 {{ data.pages.length }} 个页面，列表如下：</text>
|
|
<template v-for="(page, index) in data.pages" :key="page">
|
|
<text style="margin-top: 5px">index: {{ index }}, route: {{ page }}</text>
|
|
</template>
|
|
</view>
|
|
<button class="uni-common-mt" @click="check$page">page check $page</button>
|
|
<!-- #ifndef MP -->
|
|
<button class="uni-common-mt" @click="checkGetParentPage">
|
|
check getParentPage
|
|
</button>
|
|
<button class="uni-common-mt" @click="checkGetDialogPages">
|
|
check getDialogPages
|
|
</button>
|
|
<button id="check-get-element-by-id-btn" class="uni-common-mt" @click="checkGetElementById">
|
|
check getElementById
|
|
</button>
|
|
<button class="uni-common-mt" @click="checkGetAndroidView">
|
|
check getAndroidView
|
|
</button>
|
|
<button class="uni-common-mt" @click="checkGetIOSView">
|
|
check getIOSView
|
|
</button>
|
|
<button class="uni-common-mt" @click="checkGetHTMLElement">
|
|
check getHTMLElement
|
|
</button>
|
|
<button class="uni-common-mt" @click="checkQuerySelector">
|
|
check querySelector
|
|
</button>
|
|
<button class="uni-common-mt" @click="checkQuerySelectorAll">
|
|
check querySelectorAll
|
|
</button>
|
|
<!-- #endif -->
|
|
<!-- #ifdef APP-ANDROID -->
|
|
<button class="uni-common-mt" @click="checkGetAndroidActivity">
|
|
check getAndroidActivity
|
|
</button>
|
|
<!-- #endif -->
|
|
<!-- #ifdef APP -->
|
|
<button class="uni-common-mt" @click="checkTakeSnapshot">
|
|
check takeSnapshot
|
|
</button>
|
|
<!-- #endif -->
|
|
</view>
|
|
<!-- #ifndef MP -->
|
|
<page-head title="currentPageStyle"></page-head>
|
|
<template v-for="(item, index) in data.PageStyleArray">
|
|
<view class="page-style-item" v-if="data.currentPageStyle[item.key] != null" :key="index">
|
|
<view class="item-text">
|
|
<text class="item-text-key">{{ item.key }}:</text>
|
|
<text class="item-text-value">{{
|
|
data.currentPageStyle[item.key]
|
|
}}</text>
|
|
</view>
|
|
<view class="set-value" v-if="item.type == 'boolean'">
|
|
<switch :checked="data.currentPageStyle.getBoolean(item.key)"
|
|
@change="switchChange(item.key, $event as UniSwitchChangeEvent)">
|
|
</switch>
|
|
</view>
|
|
<view class="set-value" v-else-if="item.type == 'number'">
|
|
<slider :value="data.currentPageStyle.getNumber(item.key)" :show-value="true"
|
|
@change="sliderChange(item.key, $event as UniSliderChangeEvent)" />
|
|
</view>
|
|
<view class="set-value" v-else-if="item.type == 'string'">
|
|
<radio-group class="radio-set-value" @change="radioChange(item.key, $event as RadioGroupChangeEvent)">
|
|
<radio class="radio-value" v-for="(item2, index2) in item.value" :key="index2" :value="item2">{{ item2 }}
|
|
</radio>
|
|
</radio-group>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<!-- #ifndef APP-HARMONY -->
|
|
<button style="margin: 10px" @click="goSetDisablePullDownRefresh">
|
|
go set disable pullDownRefresh
|
|
</button>
|
|
<!-- #endif -->
|
|
<!-- #endif -->
|
|
<ComponentCheckPage ref="componentCheckPage" />
|
|
</view>
|
|
<!-- #ifdef APP -->
|
|
</scroll-view>
|
|
<!-- #endif -->
|
|
</template>
|
|
|
|
<script setup lang="uts">
|
|
import ComponentCheckPage from './component-check-page.uvue'
|
|
import { PageStyleItem, PageStyleArray } from './page-style.uts';
|
|
|
|
const currentInstance = getCurrentInstance()
|
|
|
|
const componentCheckPage = ref<ComponentPublicInstance | null>(null)
|
|
|
|
type DataType = {
|
|
checked: boolean;
|
|
pages: string[];
|
|
PageStyleArray: PageStyleItem[];
|
|
currentPageStyle: UTSJSONObject;
|
|
testing: boolean;
|
|
checkSnapshotResult: boolean;
|
|
}
|
|
|
|
const data = reactive({
|
|
checked: false,
|
|
pages: [] as string[],
|
|
PageStyleArray: PageStyleArray,
|
|
currentPageStyle: {},
|
|
testing: false,
|
|
checkSnapshotResult: false
|
|
} as DataType)
|
|
|
|
const pageStyleText = computed(() : string => {
|
|
return JSON.stringify(data.currentPageStyle)
|
|
})
|
|
|
|
const getPageStyle = () : UTSJSONObject => {
|
|
const pages: UniPage[] = getCurrentPages();
|
|
const currentPage = pages[pages.length - 1];
|
|
data.currentPageStyle = currentPage.getPageStyle()
|
|
console.log(data.currentPageStyle)
|
|
return data.currentPageStyle;
|
|
}
|
|
|
|
const setPageStyle = (style : UTSJSONObject) => {
|
|
console.log('setPageStyle:', style);
|
|
const pages = getCurrentPages();
|
|
const currentPage = pages[pages.length - 1];
|
|
currentPage.setPageStyle(style);
|
|
}
|
|
|
|
// #ifndef MP
|
|
onLoad(() => {
|
|
getPageStyle();
|
|
})
|
|
// #endif
|
|
|
|
onReady(() => {
|
|
// #ifdef APP-ANDROID
|
|
setPageStyle({
|
|
'androidThreeButtonNavigationBackgroundColor': 'transparent',
|
|
'androidThreeButtonNavigationStyle': 'black'
|
|
});
|
|
getPageStyle();
|
|
// #endif
|
|
})
|
|
|
|
onPullDownRefresh(() => {
|
|
setTimeout(() => {
|
|
uni.stopPullDownRefresh()
|
|
}, 2000)
|
|
})
|
|
const startPullDownRefresh = () => {
|
|
uni.startPullDownRefresh()
|
|
}
|
|
const _getCurrentPages = () => {
|
|
data.pages.length = 0
|
|
const pages = getCurrentPages()
|
|
data.pages.push(pages[0].route)
|
|
if (data.pages[0].includes('/tabBar/') || data.pages[0] == '/') {
|
|
data.checked = true
|
|
}
|
|
for (let i = 1; i < pages.length; i++) {
|
|
data.pages.push(pages[i].route)
|
|
if (pages[i].route.includes('/tabBar/')) {
|
|
data.checked = false
|
|
}
|
|
}
|
|
}
|
|
|
|
const setStyleValue = (key : string, value : any) => {
|
|
const style = {}
|
|
style[key] = value
|
|
setPageStyle(style)
|
|
getPageStyle()
|
|
}
|
|
|
|
/// get-set-page-style
|
|
const radioChange = (key : string, e : RadioGroupChangeEvent) => {
|
|
setStyleValue(key, e.detail.value);
|
|
}
|
|
const sliderChange = (key : string, e : UniSliderChangeEvent) => {
|
|
setStyleValue(key, e.detail.value);
|
|
}
|
|
const switchChange = (key : string, e : UniSwitchChangeEvent) => {
|
|
setStyleValue(key, e.detail.value);
|
|
}
|
|
|
|
const goSetDisablePullDownRefresh = () => {
|
|
uni.navigateTo({
|
|
url: '/pages/API/get-current-pages/set-page-style-disable-pull-down-refresh'
|
|
});
|
|
}
|
|
const getCurrentPage = () : UniPage => {
|
|
const pages = getCurrentPages()
|
|
return pages[pages.length - 1]
|
|
}
|
|
const check$page = () : boolean => {
|
|
const page = getCurrentPage()
|
|
const $page = currentInstance?.proxy?.$page
|
|
let res = $page === page
|
|
if (data.testing && res) {
|
|
res = page.options['test'] == '123'
|
|
if (res) {
|
|
res = page.route == 'pages/API/get-current-pages/get-current-pages'
|
|
}
|
|
}
|
|
console.log('check $page', res)
|
|
uni.showToast(res ? { title: 'check success' } : { title: 'check fail', icon: 'error' })
|
|
return res
|
|
}
|
|
const componentCheck$page = () : boolean => {
|
|
const res = componentCheckPage.value?.$callMethod('check$page') as boolean
|
|
console.log('component check $page', res)
|
|
return res
|
|
}
|
|
const checkGetParentPage = () : boolean => {
|
|
const page = getCurrentPage()
|
|
const parentPage = page.getParentPage()
|
|
const res = parentPage == null
|
|
console.log('check getParentPage', res)
|
|
uni.showToast(res ? { title: 'check success' } : { title: 'check fail', icon: 'error' })
|
|
return res
|
|
}
|
|
const checkGetDialogPages = () : boolean => {
|
|
const page = getCurrentPage()
|
|
const dialogPages = page.getDialogPages()
|
|
const res = Array.isArray(dialogPages) && dialogPages.length == 0
|
|
uni.showToast(res ? { title: 'check success' } : { title: 'check fail', icon: 'error' })
|
|
console.log('check getDialogPages', res)
|
|
return res
|
|
}
|
|
const checkGetElementById = () : boolean => {
|
|
const page = getCurrentPage()
|
|
const element = page.getElementById('check-get-element-by-id-btn')
|
|
let res = element != null
|
|
// #ifndef APP-ANDROID
|
|
if (res) {
|
|
const elPage = element!.getPage()
|
|
console.log('elPage', elPage)
|
|
res = elPage === page
|
|
}
|
|
// #endif
|
|
console.log('check getElementById', res)
|
|
uni.showToast(res ? { title: 'check success' } : { title: 'check fail', icon: 'error' })
|
|
return res
|
|
}
|
|
const checkGetAndroidView = () : boolean => {
|
|
const page = getCurrentPage()
|
|
const androidView = page.getAndroidView()
|
|
const res = androidView != null
|
|
let failTitle = 'check fail'
|
|
// #ifdef APP-ANDROID && VUE3-VAPOR
|
|
if (!res) {
|
|
failTitle = '仅 Android uts 插件环境支持'
|
|
}
|
|
// #endif
|
|
console.log('check getAndroidView', res)
|
|
uni.showToast(res ? { title: 'check success' } : { title: failTitle, icon: 'error' })
|
|
return res
|
|
}
|
|
const checkGetIOSView = () : boolean => {
|
|
const page = getCurrentPage()
|
|
const IOSView = page.getIOSView()
|
|
const res = IOSView != null
|
|
console.log('check getIOSView', res)
|
|
uni.showToast(res ? { title: 'check success' } : { title: '仅 IOS uts 插件环境支持', icon: 'error' })
|
|
return res
|
|
}
|
|
const checkGetHTMLElement = () : boolean => {
|
|
const page = getCurrentPage()
|
|
const HTMLView = page.getHTMLElement()
|
|
const res = HTMLView != null
|
|
console.log('check getHTMLElement', res)
|
|
uni.showToast(res ? { title: 'check success' } : { title: 'check fail', icon: 'error' })
|
|
return res
|
|
}
|
|
const checkGetAndroidActivity = () : boolean => {
|
|
const page = getCurrentPage()
|
|
const activity = page.getAndroidActivity()
|
|
const res = activity != null
|
|
let failTitle = 'check fail'
|
|
// #ifdef APP-ANDROID && VUE3-VAPOR
|
|
if (!res) {
|
|
failTitle = '仅 Android uts 插件环境支持'
|
|
}
|
|
// #endif
|
|
console.log('check getAndroidActivity', res)
|
|
uni.showToast(res ? { title: 'check success' } : { title: failTitle, icon: 'error' })
|
|
return res
|
|
}
|
|
|
|
const checkQuerySelector = () : boolean => {
|
|
const page = getCurrentPage()
|
|
const container = page.querySelector('#container')
|
|
const doesNotExist = page.querySelector('#does-not-exist')
|
|
const res = (container != null) && (doesNotExist == null)
|
|
console.log('check checkQuerySelector', res)
|
|
uni.showToast(res ? { title: 'check success' } : { title: 'check fail', icon: 'error' })
|
|
return res
|
|
}
|
|
const checkQuerySelectorAll = () : boolean => {
|
|
const page = getCurrentPage()
|
|
const btnList = page.querySelectorAll('.uni-common-mt')
|
|
const doesNotExistList = page.querySelectorAll('.does-not-exist')
|
|
const res = (btnList.length > 1) && (doesNotExistList.length == 0)
|
|
console.log('check checkQuerySelectorAll', res)
|
|
uni.showToast(res ? { title: 'check success' } : { title: 'check fail', icon: 'error' })
|
|
return res
|
|
}
|
|
|
|
const checkTakeSnapshot = () => {
|
|
const page = getCurrentPage()
|
|
let callBackNum = 0
|
|
page.takeSnapshot({
|
|
success: (res) => {
|
|
console.log('check takeSnapshot success', res)
|
|
uni.showToast({ title: 'check success' })
|
|
callBackNum++
|
|
if(callBackNum == 2){
|
|
data.checkSnapshotResult = true
|
|
}
|
|
},
|
|
fail: (err) => {
|
|
console.log('check takeSnapshot fail', err)
|
|
uni.showToast({ title: 'check fail', icon: 'error' })
|
|
callBackNum--
|
|
},
|
|
complete: (info) => {
|
|
console.log('check takeSnapshot complete', info)
|
|
callBackNum++
|
|
if(callBackNum == 2){
|
|
data.checkSnapshotResult = true
|
|
}
|
|
}
|
|
})
|
|
}
|
|
|
|
defineExpose({
|
|
data,
|
|
pageStyleText,
|
|
_getCurrentPages,
|
|
getPageStyle,
|
|
setPageStyle,
|
|
startPullDownRefresh,
|
|
check$page,
|
|
componentCheck$page,
|
|
checkGetParentPage,
|
|
checkGetDialogPages,
|
|
checkGetElementById,
|
|
checkGetAndroidView,
|
|
checkGetIOSView,
|
|
checkGetHTMLElement,
|
|
checkQuerySelector,
|
|
checkQuerySelectorAll,
|
|
checkGetAndroidActivity,
|
|
checkTakeSnapshot
|
|
})
|
|
</script>
|
|
|
|
<style>
|
|
.page {
|
|
flex: 1;
|
|
padding: 10px;
|
|
}
|
|
|
|
.page-style {
|
|
margin-top: 15px;
|
|
}
|
|
|
|
.page-style-item {
|
|
padding: 10px;
|
|
margin-top: 10px;
|
|
background-color: #ffffff;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.item-text {
|
|
flex-direction: row;
|
|
}
|
|
|
|
.item-text-key {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.item-text-value {
|
|
margin-left: 5px;
|
|
}
|
|
|
|
.set-value {
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.radio-set-value {
|
|
flex-direction: row;
|
|
}
|
|
|
|
.radio-value {
|
|
margin-left: 10px;
|
|
}
|
|
</style>
|