Skip to content

H
hello uni-app x

DCloud / hello uni-app x

通知 6006
Star 91
Fork 164
H
hello uni-app x
提交 9846133f 编写于 作者: DCloud_Heavensoft's avatar DCloud_Heavensoft
浏览文件
操作

Update template.uvue

上级 228cce67
隐藏空白更改
内联 并排
Showing with 204 addition and 198 deletion
pages/tabBar/template.uvue
浏览文件 @ 9846133f
<template> <template>
<!-- #ifdef APP --> <!-- #ifdef APP -->
<scroll-view style="flex: 1"> <scroll-view style="flex: 1">
<!-- #endif --> <!-- #endif -->
<view class="uni-container"> <view class="uni-container">
<view class="uni-header-logo"> <view class="uni-header-logo">
<image class="uni-header-image" src="/static/templateIndex.png"></image> <image class="uni-header-image" src="/static/templateIndex.png"></image>
</view> </view>
<view class="uni-text-box"> <view class="uni-text-box">
<text class="hello-text">以下是部分模板示例，更多模板见插件市场：</text> <text class="hello-text">以下是部分模板示例，更多模板见插件市场：</text>
<u-link <u-link
href="https://ext.dcloud.net.cn" href="https://ext.dcloud.net.cn"
:text="'https://ext.dcloud.net.cn'" :text="'https://ext.dcloud.net.cn'"
:inWhiteList="true" :inWhiteList="true"
></u-link> ></u-link>
</view> </view>
<view class="uni-panel" v-for="(item, index) in list" :key="item.id"> <view class="uni-panel" v-for="(item, index) in list" :key="item.id">
<view <view
class="uni-panel-h" class="uni-panel-h"
:class="item.open ? 'uni-panel-h-on' : ''" :class="item.open ? 'uni-panel-h-on' : ''"
@click="triggerCollapse(index, item)" @click="triggerCollapse(index, item)"
> >
<text <text
class="uni-panel-text" class="uni-panel-text"
:class="item.enable == false ? 'text-disabled' : ''" :class="item.enable == false ? 'text-disabled' : ''"
>{{ item.name }}</text >{{ item.name }}</text
> >
<image <image
:src=" :src="
item.pages.length > 0 item.pages.length > 0
? item.open ? item.open
? arrowUpIcon ? arrowUpIcon
: arrowDownIcon : arrowDownIcon
: arrowRightIcon : arrowRightIcon
" "
class="uni-icon" class="uni-icon"
> >
</image> </image>
</view> </view>
<view class="uni-panel-c" v-if="item.open"> <view class="uni-panel-c" v-if="item.open">
<view <view
class="uni-navigate-item" class="uni-navigate-item"
:hover-class="page.enable == false?'':'is--active'" :hover-class="page.enable == false?'':'is--active'"
v-for="(page, key) in item.pages" v-for="(page, key) in item.pages"
:key="key" :key="key"
@click="goDetailPage(page)" @click="goDetailPage(page)"
> >
<text <text
class="uni-navigate-text" class="uni-navigate-text"
:class="page.enable == false ? 'text-disabled' : ''" :class="page.enable == false ? 'text-disabled' : ''"
>{{ page.name }}</text >{{ page.name }}</text
> >
<image :src="arrowRightIcon" class="uni-icon"></image> <image :src="arrowRightIcon" class="uni-icon"></image>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<!-- #ifdef APP --> <!-- #ifdef APP -->
</scroll-view> </scroll-view>
<!-- #endif --> <!-- #endif -->
</template> </template>
<script lang="uts"> <script lang="uts">
type Page = { type Page = {
name: string name: string
enable?: boolean enable?: boolean
url: string url: string
} }
type ListItem = { type ListItem = {
id: string id: string
name: string name: string
open: boolean open: boolean
pages: Page[] pages: Page[]
url?: string url?: string
enable?: boolean enable?: boolean
} }
export default { export default {
data() { data() {
return { return {
list: [ list: [
{ {
id: 'long-list', id: 'long-list',
url: 'long-list', url: 'long-list',
name: '左右滑动长列表', name: '左右滑动长列表',
open: false, open: false,
enable: true, enable: true,
pages: [ pages: [
{ {
name: '顶部搜索框随时下移长列表', name: '顶部搜索框随时下移长列表',
...@@ -94,7 +94,7 @@ export default { ...@@ -94,7 +94,7 @@ export default {
name: '顶部banner长列表', name: '顶部banner长列表',
url:'long-list2' url:'long-list2'
}, },
] as Page[], ] as Page[],
}, },
{ {
id: 'list-news', id: 'list-news',
...@@ -102,19 +102,19 @@ export default { ...@@ -102,19 +102,19 @@ export default {
name: '列表到详情', name: '列表到详情',
open: false, open: false,
pages: [] as Page[], pages: [] as Page[],
}, },
{ {
id: 'scroll-fold-nav', id: 'scroll-fold-nav',
url: 'scroll-fold-nav', url: 'scroll-fold-nav',
name: '随滚动折叠的导航栏', name: '随滚动折叠的导航栏',
open: false, open: false,
pages: [] as Page[], pages: [] as Page[],
}, },
{ {
id: 'swiper-list', id: 'swiper-list',
url: 'swiper-list', url: 'swiper-list',
name: 'swiper-list', name: 'swiper-list',
open: false, open: false,
pages: [ pages: [
{ {
name: '下划线样式', name: '下划线样式',
...@@ -124,50 +124,50 @@ export default { ...@@ -124,50 +124,50 @@ export default {
name: '字体放大样式', name: '字体放大样式',
url:'swiper-list2' url:'swiper-list2'
}, },
] as Page[], ] as Page[],
},
{
id: 'custom-refresher',
url: 'custom-refresher',
name: '自定义下拉刷新',
open: false,
pages: [] as Page[],
},
{
id: 'pull-zoom-image',
url: 'pull-zoom-image',
name: '下拉缩放顶部封面图',
open: false,
pages: [] as Page[],
}, },
{ {
id: 'custom-refresher', id: 'swiper-vertical-video',
url: 'custom-refresher', url: 'swiper-vertical-video',
name: '自定义下拉刷新', name: '竖滑视频',
open: false, open: false,
pages: [] as Page[], pages: [] as Page[],
}, },
{ {
id: 'pull-zoom-image', id: 'scroll-sticky',
url: 'pull-zoom-image', url: 'scroll-sticky',
name: '下拉缩放顶部封面图', name: 'scroll-view自定义滚动吸顶',
open: false, open: false,
pages: [] as Page[], pages: [] as Page[],
}, },
{ // {
id: 'swiper-vertical-video', // id: 'half-screen',
url: 'swiper-vertical-video', // url: 'half-screen',
name: '竖滑视频', // name: '半屏弹窗',
open: false,
pages: [] as Page[],
},
{
id: 'scroll-sticky',
url: 'scroll-sticky',
name: 'scroll-view自定义滚动吸顶',
open: false,
pages: [] as Page[],
},
// {
// id: 'half-screen',
// url: 'half-screen',
// name: '半屏弹窗',
// open: false, // open: false,
// enable: false, // enable: false,
// pages: [] as Page[], // pages: [] as Page[],
// }, // },
{ {
id: 'drop-card', id: 'drop-card',
url: 'drop-card', url: 'drop-card',
name: '划走式卡片', name: '划走式卡片',
open: false, open: false,
pages: [] as Page[], pages: [] as Page[],
}, },
{ {
id: 'navbar-lite', id: 'navbar-lite',
...@@ -183,59 +183,65 @@ export default { ...@@ -183,59 +183,65 @@ export default {
open: false, open: false,
enable: true, enable: true,
pages: [] as Page[], pages: [] as Page[],
}, },
{ {
id: 'calendar', id: 'calendar',
url: 'calendar', url: 'calendar',
name: '日历', name: '日历',
open: false, open: false,
pages: [] as Page[], pages: [] as Page[],
}, },{
] as ListItem[], id: 'schema',
arrowUpIcon: '/static/icons/arrow-up.png', url: 'schema',
arrowDownIcon: '/static/icons/arrow-down.png', name: '打开外部链接',
arrowRightIcon: '/static/icons/arrow-right.png', open: false,
} pages: [] as Page[],
}, },
methods: { ] as ListItem[],
triggerCollapse(index: number, item: ListItem) { arrowUpIcon: '/static/icons/arrow-up.png',
if (item.pages.length == 0) { arrowDownIcon: '/static/icons/arrow-down.png',
const page: Page = { arrowRightIcon: '/static/icons/arrow-right.png',
name: item.name, }
enable: item.enable, },
url: item.url!, methods: {
} triggerCollapse(index: number, item: ListItem) {
this.goDetailPage(page) if (item.pages.length == 0) {
return const page: Page = {
} name: item.name,
for (var i = 0; i < this.list.length; ++i) { enable: item.enable,
if (index == i) { url: item.url!,
this.list[i].open = !this.list[i].open }
} else { this.goDetailPage(page)
this.list[i].open = false return
} }
} for (var i = 0; i < this.list.length; ++i) {
}, if (index == i) {
goDetailPage(e: Page) { this.list[i].open = !this.list[i].open
if (e.enable == false) { } else {
uni.showToast({ this.list[i].open = false
icon: 'none', }
title: '暂不支持', }
}) },
return goDetailPage(e: Page) {
} if (e.enable == false) {
const url = uni.showToast({
e.url.indexOf('platform') > -1 icon: 'none',
? e.url title: '暂不支持',
: `/pages/template/${e.url}/${e.url}` })
uni.navigateTo({ return
url, }
}) const url =
}, e.url.indexOf('platform') > -1
}, ? e.url
} : `/pages/template/${e.url}/${e.url}`
</script> uni.navigateTo({
url,
<style> })
@import '../../common/uni-uvue.css'; },
</style> },
}
</script>
<style>
@import '../../common/uni-uvue.css';
</style>
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或