123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143 |
- <template>
- <view class="wrapper">
- <image class="banner" src="../../../static/bg.png" mode=""></image>
- <view class="tabs">
- <view class="tab-box">
- <newsPage class="page-item" ref="pageRp"></newsPage>
- </view>
- </view>
- </view>
- </template>
- <script>
- import newsPage from './itemPage.nvue';
- export default {
- components: {
- newsPage
- },
- data() {
- return {
- newsid: "",
- tabClick: false, // true 表示是两次点击中的第一次点了 tabBar
- }
- },
- onTabItemTap(e) {
- // tab 点击时执行,此处直接接收单击事件
- // console.log(e)
- if (this.tabClick) { // 200ms 内再次点击
- // 这里就是模拟的双击事件,可以写类似数据刷新相关处理
- this.$refs.pageRp.requestParams.pageIndex = 1;
- this.$refs.pageRp.loadData(true);
- }
- this.tabClick = true
- setTimeout(() => {
- this.tabClick = false // 200ms 内没有第二次点击,就当作单击
- }, 200)
- },
- onNavigationBarButtonTap(e) {
- if(this.$refs.pageRp.dataList.length > 0){
- uni.navigateTo({
- url:'/pages/webview/popupNews',
- })
- }
- },
- onReady() {
- this.$refs.pageRp.loadData();
- },
- methods: {
- }
- }
- </script>
- <style>
- /* #ifndef APP-PLUS */
- page {
- width: 100%;
- min-height: 100%;
- display: flex;
- }
- /* #endif */
- .banner{
- width: 750rpx;
- height: 320rpx;
- position: fixed;
- top: 0;
- left: 0;
- right: 0;
- }
- .tabs {
- flex: 1;
- flex-direction: column;
- overflow: hidden;
- border-radius: 15px;
- position: fixed;
- top: 0;
- bottom: 0;
- left:20rpx;
- right: 20rpx;
- background-color: #fff;
- }
- .tab-bar {
- /* #ifdef APP-PLUS */
- width: 750rpx;
- /* #endif */
- height: 42px;
- flex-direction: row;
- /* #ifndef APP-PLUS */
- white-space: nowrap;
- /* #endif */
- }
- .scroll-view-indicator {
- position: relative;
- height: 2px;
- background-color: transparent;
- }
- .scroll-view-underline {
- position: absolute;
- top: 0;
- bottom: 0;
- width: 0;
- background-color: #007AFF;
- }
- .scroll-view-animation {
- transition-duration: 0.2s;
- transition-property: left;
- }
- .tab-bar-line {
- height: 1px;
- background-color: #cccccc;
- }
- .tab-box {
- flex: 1;
- }
- .swiper-item {
- flex: 1;
- flex-direction: column;
- }
- .page-item {
- flex: 1;
- flex-direction: row;
- position: absolute;
- overflow: hidden;
- left: 20rpx;
- padding:30rpx;
- top: 5rpx;
- right:20rpx;
- bottom: 0;
- }
- </style>
|