talk_appAmin/pages/Friend/messageswitching.vue

54 lines
1.1 KiB
Vue

<template>
<view style="display: flex;">
<view>
<image src="../../static/images/sign/return.png" />
</view>
<view>
<u-tabs :lineWidth="25" :lineHeight="2" itemStyle="padding:11px;" lineColor="#3477fc" :list="list1"
@change="tabChange"></u-tabs>
</view>
</view>
<view v-if="NewIndex === 1">
<view style="position: fixed; top: 0;bottom: 1122rpx; left: 0; right: 0;background: linear-gradient(0deg, #ffffff, #c9f6f5); z-index: -1;"></view>
<messagenotificationVue></messagenotificationVue>
</view>
<view v-if="NewIndex === 0">
<addressbookVue></addressbookVue>
</view>
</template>
<script setup>
import {
reactive,
ref
} from "vue";
import messagenotificationVue from "./messagenotification.vue";
import addressbookVue from "./addressbook.vue";
const list1 = reactive([{
name: '通讯录'
},
{
name: '消息'
}
])
const NewIndex = ref(0);
function tabChange(index) {
console.log('当前选中的选项卡索引:', index);
NewIndex.value = index.index;
}
</script>
<style>
image {
width: 31rpx;
height: 44rpx;
}
</style>