123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869 |
- <template>
- <view>
- <uni-section title="实心标签" type="line">
- <view class="uni-padding-wrap uni-common-mt">
- <uni-segmented-control :current="data.current" :values="data.items" style-type="button"
- active-color="#007aff" @clickItem="onChangeTab" />
- </view>
- <view class="content">
- <view v-if="data.current === 0">
- <!--数学-->
- <uni-list>
- <uni-list-item v-for="item in data.ShuxueList">
- <template v-slot:body>
- <view class="slot-box">
- {{item}}
- <text class="slot-text">title</text>
- <text class="slot-text">date</text>
- <text class="slot-text">wrong</text>
- <button>查看错题</button>
- </view>
- </template>
- </uni-list-item>
- <uni-load-more :status="data.moreShuxue"></uni-load-more>
- </uni-list>
- </view>
- <view v-if="data.current === 1">
- <!--英语-->
- <uni-list>
- <uni-list-item v-for="item in data.YingyuList">
- <template v-slot:body>
- <view class="slot-box">
- {{item}}
- <text class="slot-text">title</text>
- <text class="slot-text">date</text>
- <text class="slot-text">wrong</text>
- <button>查看错题</button>
- </view>
- </template>
- </uni-list-item>
- <uni-load-more :status="data.moreYingyu"></uni-load-more>
- </uni-list>
- </view>
- </view>
- </uni-section>
- </view>
- </template>
- <script setup>
- import {reactive, computed} from "vue";
- const data = reactive({
- items: ['选项卡1', '选项卡2', '选项卡3'],
- current: 0,
- ShuxueList: [],
- YingyuList: [],
- moreYingyu: 'more',
- moreShuxue: 'more'
- })
- function onChangeTab(e) {
- if (this.current !== e.currentIndex) {
- this.current = e.currentIndex
- }
- }
- </script>
- <style>
-
- </style>
|