uniapp小笔记

1.创建项目  vue create -p dcloudio/uni-preset-vue dnpicture

2安装 sass依赖 npm install sass-loader@7.3.1 [email protected]

3.getApp().globalData 可以设置全局变量

4.在scroll-view 里做了flex布局  需要添加 enable-flex才能使display:flex生效

getList(){
            this.request({
                url: `http://157.122.54.189:9088/image/v1/wallpaper/album/${this.id}/wallpaper`,
                data: this.params
            }).then(result => {
                // console.log(result);
                if(Object.keys(this.album).length === 0){
                    this.album = result.res.album;
                }

                if(result.res.wallpaper.length ===0){
                    this.hasMore = false;
                    uni.showToast({
                        title: '没有更多数据了',
                        icon:'none'
                    });
                    return
                }
                    this.wallpaper = [...this.wallpaper, ...result.res.wallpaper];
            })
        }

// 页面触底 上拉加载下一页事件     onReachBottom(){         // console.log('22');         if(this.hasMore){             this.params.first = 0;             this.params.skip += this.params.limit;             this.getList();         }else{             uni.showToast({                 title: '没有更多数据了',                 icon:'none'             });         }     },

5.以上代码是做了一个分页的效果，多次请求图片然后通过 展开运算符添加到数组中，如果是有2个以上的tab栏目 需要把数组清空 skip重置为0 然后重新发送请求

6.// 修改页面的标题uni.setNavigationBarTitle({title: '最新' });

7.引入moment.js 可以实现一些时间的转换

import moment from "moment";  this.monthes = res.res.homepage[2];                     // 将时间改成 18号   moment.js this.monthes.MM = moment(this.monthes.stime).format('MM'); this.monthes.DD = moment(this.monthes.stime).format('DD'); 8. import {uniSegmentedControl} from '@dcloudio/uni-ui'  分段器的使用 9. 组件封装的重要性