提交 11c14aaf 编写于 作者: 赵十四's avatar 赵十四

导航栏完成

上级 ac94876d
......@@ -2,6 +2,7 @@
export default {
onLaunch: function() {
console.log('App Launch')
uni.hideTabBar();
},
onShow: function() {
console.log('App Show')
......
<template>
<view>
<u-tabbar :value="current?current:0" @change="tabbarChange" :fixed="true" :placeholder="false"
:safeAreaInsetBottom="true" activeColor="#dd524d">
<u-tabbar-item text="运动" icon="../../static/tabbar/运动.svg"></u-tabbar-item>
<u-tabbar-item text="发现" icon="../../static/tabbar/发现.svg"></u-tabbar-item>
<!-- <u-tabbar-item text="鱼塘" icon="../../static/pool.svg" ></u-tabbar-item>
<u-tabbar-item text="我的" icon="../../static/mine.svg" ></u-tabbar-item> -->
:safeAreaInsetBottom="true" activeColor="#F1992D">
<u-tabbar-item text="运动" icon="../../static/tabbar/运动.png"></u-tabbar-item>
<u-tabbar-item text="发现" icon="../../static/tabbar/发现.png"></u-tabbar-item>
<u-tabbar-item text="高校圈" icon="../../static/tabbar/圈子.png"></u-tabbar-item>
<u-tabbar-item text="小队" icon="../../static/tabbar/队伍.png"></u-tabbar-item>
<u-tabbar-item text="我的" icon="../../static/tabbar/我的.png"></u-tabbar-item>
</u-tabbar>
</view>
</template>
......@@ -17,8 +18,22 @@
},
data() {
return {
list: [{ path: "pages/login/login" },
{ path: "pages/login/register" },
list: [{
path: "pages/sport/main"
},
{
path: "pages/discover/main"
},
{
path: "pages/post/post"
},
{
path: "pages/team/main"
},
{
path: "pages/my/main"
}
]
};
},
......
import App from './App'
import Vue from 'vue'
import './uni.promisify.adaptor'
import uView from '@/uni_modules/uview-ui'
Vue.use(uView)
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
......
{
"easycom": {
"^u-(.*)": "@/uni_modules/uview-ui/components/u-$1/u-$1.vue"
},
"pages": [
"pages": [
// {
// "path": "pages/login/login",
// "style": {
// "navigationStyle": "custom"
// }
// }, {
// "path": "pages/login/register",
// "style": {
// "navigationStyle": "custom"
// }
// },
{
"path": "pages/login/login",
"path": "pages/sport/main",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "pages/discover/main",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "pages/post/post",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "pages/team/main",
"style": {
"navigationStyle": "custom"
}
},
{
"path": "pages/my/main",
"style": {
"navigationStyle": "custom"
}
}
,{
"path" : "pages/login/register",
"style" :
{
"navigationStyle": "custom"
}
},{
"path" : "pages/helang-tabBar/helang-tabBar",
"style" :
{
"navigationStyle": "custom"
}
},{
"path" : "pages/sport/main",
"style" :
{
"navigationStyle": "custom"
}
}
],
],
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8"
},
"tabBar": {
"tabBar": {
"list": [{
"pagePath": "pages/login/login"
"pagePath": "pages/sport/main"
},
{
"pagePath": "pages/discover/main"
},
{
"pagePath": "pages/post/post"
},
{
"pagePath": "pages/team/main"
},
{
"pagePath": "pages/login/register"
"pagePath": "pages/my/main"
}
]
},
"uniIdRouter": {}
}
}
\ No newline at end of file
<template>
<view>
<text>发现</text>
<tabbar :current="1" />
</view>
</template>
<script>
export default {
onLoad() {
uni.hideTabBar();
},
}
</script>
<style>
</style>
\ No newline at end of file
<template>
<view>
<view class="preview" style="background-color: #82a9f2;">
<view class="title">翻滚效果</view>
<helang-tab-bar-roll :fixed-bottom="false"></helang-tab-bar-roll>
</view>
<view class="preview" style="background-color: #313131;">
<view class="title" style="margin-bottom: 30px;">冒泡效果</view>
<helang-tab-bar-bubble :fixed-bottom="false"></helang-tab-bar-bubble>
</view>
<view class="preview" style="background-color: #b49df9;">
<view class="title">翻转效果</view>
<helang-tab-bar-overturn :fixed-bottom="false"></helang-tab-bar-overturn>
</view>
<view class="preview" style="background-color: #efedee;">
<view class="title" style="margin-bottom: 30px;color: #333;">凸起舵式切换效果</view>
<helang-tab-bar-bulge :fixed-bottom="false"></helang-tab-bar-bulge>
</view>
<view class="preview" style="background-color: #f4614e;">
<view class="title" style="margin-bottom: 30px;">窗帘下拉效果</view>
<helang-tab-bar-curtain :fixed-bottom="false"></helang-tab-bar-curtain>
</view>
</view>
</template>
<script>
import tabBarRoll from "@/components/helang-tabBar/tab-bar-roll";
import tabBarBubble from "@/components/helang-tabBar/tab-bar-bubble";
import tabBarOverturn from "@/components/helang-tabBar/tab-bar-overturn";
import tabBarBulge from "@/components/helang-tabBar/tab-bar-bulge";
import tabBarCurtain from "@/components/helang-tabBar/tab-bar-curtain";
export default {
components: {
"helang-tab-bar-roll": tabBarRoll,
"helang-tab-bar-bubble": tabBarBubble,
"helang-tab-bar-overturn": tabBarOverturn,
"helang-tab-bar-bulge": tabBarBulge,
"helang-tab-bar-curtain": tabBarCurtain
},
data() {
return {
}
},
methods: {
}
}
</script>
<style lang="scss">
.preview{
margin-bottom: 24px;
padding: 32px 8px;
.title{
font-weight: 32rpx;
margin-bottom: 20rpx;
padding-left: 10px;
color: #fff;
}
}
</style>
......@@ -15,6 +15,7 @@
</uni-forms-item>
</uni-forms>
</view>
</view>
</template>
......@@ -30,6 +31,9 @@
export default {
name: 'login',
components: {},
onLoad() {
uni.hideTabBar();
},
data() {
return {
formData: {
......
<template>
<view>
<text>我的</text>
<tabbar :current="4" />
</view>
</template>
<script>
export default {
onLoad() {
uni.hideTabBar();
},
}
</script>
<style>
</style>
\ No newline at end of file
<template>
<view>
<tabbar :current="2" />
<u-tabs :list="list" lineWidth="30" lineColor="#F1992D" :activeStyle="{
color: '#F1992D',
fontWeight: 'bold',
transform: 'scale(1.05)'
}" :inactiveStyle="{
color: '#606266',
transform: 'scale(1)'
}" itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;"
@click="tabChange"
:current="current">
</u-tabs>
<view v-if="current == 1">
<text>所有帖子</text>
</view>
<!-- 我的帖子 -->
<view v-if="current == 0">
<text>我的帖子</text>
</view>
</view>
</template>
<script>
export default {
onLoad() {
uni.hideTabBar();
},
data() {
return {
current:1,
list: [{
name: '我的帖子'
}, {
name: '高校圈',
}, ]
};
},
methods: {
tabChange(index) {
this.current = index.index;
//console.log(this.current)
// this.followUserPost = [];
// this.lastPost = [];
// if (index === 0) {
// this.page1 = 1;
// this.getFollowUserPost();
// }
// if (index === 1) {
// this.page2 = 1;
// this.getLastPost();
// }
},
}
}
</script>
<style>
</style>
\ No newline at end of file
<template>
<view>
<text>运动</text>
<tabbar :current="0" />
</view>
</template>
<map :scale='18' id="myMap" style="width: 100%;" :style="{height: mapHeight + 'px'}" :markers="markers"
:longitude="longitude" :latitude="latitude" :circles="circles"></map>
<script>
export default {
onLoad() {
uni.hideTabBar();
},
}
</script>
<style>
......
<template>
<view>
<text>小队</text>
<tabbar :current="3" />
</view>
</template>
<script>
export default {
onLoad() {
uni.hideTabBar();
},
}
</script>
<style>
</style>
\ No newline at end of file
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册