98 lines
2.5 KiB
Vue
98 lines
2.5 KiB
Vue
<template>
|
|
<view>
|
|
<uni-nav-bar shadow left-icon="left" fixed rightIcon="more-filled" rightText="编辑" title="他/她的主页"
|
|
backgroundColor="transparent" />
|
|
|
|
<uni-swiper-dot class="uni-swiper-dot-box" :info="info" :current="current" mode="round" field="content">
|
|
<swiper class="swiper-box" :current="swiperDotIndex">
|
|
<swiper-item v-for="(item, index) in info" :key="index">
|
|
<view class="swiper-item" :class="'swiper-item' + index">
|
|
<image :src="item.url" mode="widthFix" alt=""></image>
|
|
</view>
|
|
</swiper-item>
|
|
</swiper>
|
|
</uni-swiper-dot>
|
|
<uni-section class="mb-10" title="昵称">
|
|
</uni-section>
|
|
<uni-section class="mb-10" title="最新动态">
|
|
<template v-slot:right>
|
|
<uni-icons type="right"></uni-icons>
|
|
</template>
|
|
</uni-section>
|
|
<uni-section class="mb-10" title="认证信息">
|
|
<template v-slot:right>
|
|
<uni-icons type="right"></uni-icons>
|
|
</template>
|
|
</uni-section>
|
|
<uni-section class="mb-10" title="个人资料">
|
|
<template v-slot:right>
|
|
<uni-icons type="right"></uni-icons>
|
|
</template>
|
|
</uni-section>
|
|
<uni-section class="mb-10" title="我想说的话">
|
|
<template v-slot:right>
|
|
<uni-icons type="right"></uni-icons>
|
|
</template>
|
|
</uni-section>
|
|
<uni-section class="mb-10" title="我的标签">
|
|
<template v-slot:right>
|
|
<uni-icons type="right"></uni-icons>
|
|
</template>
|
|
</uni-section>
|
|
<uni-section class="mb-10" title="贵族">
|
|
<template v-slot:right>
|
|
<uni-icons type="right"></uni-icons>
|
|
</template>
|
|
</uni-section>
|
|
|
|
<uni-goods-nav :fill="true" :options="options" :button-group="buttonGroup" style="margin-top: 20px;" />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
current: 0,
|
|
swiperDotIndex: 0,
|
|
info: [{
|
|
colorClass: 'uni-bg-red',
|
|
url: 'https://web-assets.dcloud.net.cn/unidoc/zh/shuijiao.jpg',
|
|
content: '内容 A'
|
|
},
|
|
{
|
|
colorClass: 'uni-bg-green',
|
|
url: 'https://web-assets.dcloud.net.cn/unidoc/zh/shuijiao.jpg',
|
|
content: '内容 B'
|
|
},
|
|
{
|
|
colorClass: 'uni-bg-blue',
|
|
url: 'https://web-assets.dcloud.net.cn/unidoc/zh/shuijiao.jpg',
|
|
content: '内容 C'
|
|
}
|
|
],
|
|
options: [{
|
|
icon: 'chat',
|
|
text: '私信',
|
|
}, {
|
|
icon: 'star',
|
|
text: '关注',
|
|
}],
|
|
buttonGroup: [{
|
|
text: '撩一下TA',
|
|
backgroundColor: 'linear-gradient(90deg, #ff55ff, #ff557f)',
|
|
color: '#fff'
|
|
}
|
|
],
|
|
}
|
|
},
|
|
methods: {
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style>
|