//接口地址
const apiUrl=‘‘;

//定义公用方法
const sayHi=function(){
    console.log(‘hi‘);
}


//输出
export default{
    apiUrl,
    sayHi
}

import common from "../../common/common.js";

data() {
            return{
                loadingTxt: ‘加载更多‘,
                newsList: [],
                common.apiUrl
            }
        },

<template>
    <view style="flex-wrap: wrap;">
        <!-- 轮播图 -->
        <swiper indicator-dots="true" autoplay="true" >
            <swiper-item>
                <image src="/static/image/BasicsBg.png"></image>
            </swiper-item>
            <swiper-item>
                <image src="/static/image/componentBg.png"></image>
            </swiper-item>
            <swiper-item>
                冷链App
            </swiper-item>
        </swiper>
        <!-- 显示数据 -->
        <!-- <navigator class="news-list" :url="‘./info?newsid=‘+item.newsid" v-for="(item,index) in newsList"> -->
        <navigator class="news-list" url="./info" v-for="(item,index) in newsList">
            <image src="../../static/image/component_cur.png" mode="widthFix"></image>
            <View class="news-title">
                {{item}}
            </View>
        </navigator>
        
        
        <!-- 加载视图 -->
        <view class="loading">{{loadingTxt}}</view>
    </view>
</template>

<script>
    import common from "../../common/common.js";
    var _self,page=1,timer=null;
    export default {
        data() {
            return{
                loadingTxt: ‘加载更多‘,
                newsList: [],
                common.apiUrl
            }
        },
        onLoad:function(){//初始化加载
            this.getNews();
            _self=this;
            uni.showLoading({
                title:‘欢迎使用App‘
            });
            setTimeout(function () {
                uni.hideLoading();
            }, 2000);
        },
        onPullDownRefresh:function(){//下拉刷新监听方法
            this.getNews();
        },
        onReachBottom: function(){//上拉加载监听方法
            this.getMoreNews();
            if(timer!=null){clearTimeout(timer);}
            timer=setTimeout(function(){
                _self.getMoreNews();
            },5000);
        },
        methods:{
            getNews:function(){
                page=1;
                //显示加载中动画
                uni.showNavigationBarLoading();
                //请求数据
                uni.request({
                    url: ‘https://demo.hcoder.net/index.php?user=hcoder&pwd=hcoder&m=list1&page=‘+page,
                    //url: ‘https://www.easy-mock.com/mock/5bb833775df5622d84ac87ca/example/news#!method=get‘,
                    success:function(res){
                        console.log(res);
                        var newsList=res.data.split(‘--hcSplitor--‘);;
                        _self.newsList=newsList;
                        //成功获取数据后结束下拉刷新
                        uni.stopPullDownRefresh();
                        //成功获取数据后隐藏加载动画
                        uni.hideNavigationBarLoading();
                        page++;
                    }
                })
            },
            getMoreNews:function(){
                //判断是否已经加载全部
                if(_self.loadingTxt==‘已经加载全部‘){return false;}
                _self.loadingTxt=‘加载中‘;
                //显示加载中动画
                uni.showNavigationBarLoading();
                //请求数据
                uni.request({
                    url: ‘https://demo.hcoder.net/index.php?user=hcoder&pwd=hcoder&m=list1&page=‘+page,
                    success:function(res){
                        console.log(res);
                        uni.hideNavigationBarLoading();
                        if(res.data==null){
                            _self.loadingTxt=‘已经加载全部‘;
                            return false;
                        }
                        var newsList=res.data.split(‘--hcSplitor--‘);
                        _self.newsList=_self.newsList.concat(newsList);
                        //成功获取数据后结束下拉刷新
                        uni.stopPullDownRefresh();
                        //成功获取数据后隐藏加载动画
                        uni.hideNavigationBarLoading();
                        page++;
                        _self.loadingTxt=‘加载更多‘;
                    }
                })
            }
            
            
        }
    }
</script>

<style>
view{width:100%}
swiper-item{
    background: #00FF00;
    height: 200px;
    width: 100%;
}
swiper-item image{
    width: 100%;
}
.loading{
    line-height: 2em;
    text-align: center;
    color:#888;
    margin-top: 30px;
}
.news-list{
    display: flex;
    width: 94%;
    padding: 1upx 3%;
    flex-wrap: nowrap;
    margin: 12upx 0;
}
.news-list image{
    width: 150upx;
    margin-right: 12upx;
    flex-shrink: 0;
}
.news-title{
    width: 100%;
    height: auto;
    margin-top: 10px;
    font-size: 28upx;
}
</style>