#私藏项目实操分享#
old find/index.vue代码
{{item.storeName}}
{{item.storeAddress}}
<!--
4.6km
-->
{{ item.distance > 1000 ? (item.distance / 1000).toFixed(2) + "km" : item.distance + "m" }}
让利{{item.yieldInterest}}%
店铺设置
import noRecords from '../../common/components/noRecords/noRecords.vue';
import UniLoadMore from "../../components/uni-load-more/uni-load-more";//暂无记录
//import noStore from "../../common/components/noStore";
//import noLogin from "../../common/components/noLogin";
//暂无记录
export default {
components: {
noRecords,
UniLoadMore
//noStore,
//noLogin,
},
data() {
return {
svHeight: 0,
isLoading: false,//是否正在请求数据
storeList: [],//商品详情
pageNumber: 1,
total: 0,
loadingType: 'more',
loaded: '',
//isLoadMore: false, //是否加载中
// loadStatus: 'loading',
pageSize: 10,
accountId: '',
}
},
computed: {
getImage() {
let images = {
orderFinished: this.$commonImage.orderFinished,
filePath: this.$commonImage.filePath,
noOrder: this.$commonImage.noOrder
}
return images;
},
getStoreListLength() {
return this.storeList.length !== 0;
},
},
onReady() {
console.log("onReady(｡･∀･)ﾉﾞ嗨：");
let that = this;
// #ifdef H5 || APP-PLUS || MP-ALIPAY
uni.getSystemInfo({
success: function (res) {
const query = uni.createSelectorQuery().in(that)
query.select('.store')
.boundingClientRect(data => {
that.svHeight = (res.windowHeight - data.top);
})
.exec();
}
});
// #endif
// h5 app mp-alipay不支持微信的方法
// #ifndef H5 || APP-PLUS || MP-ALIPAY
// 获取胶囊位置,API getMenuButtonBoundingClientRect 只有在微信小程序运行的时候才会生效，H5端查看会报错
uni.getSystemInfo({
success: function (res) {
console.log("res==", res);
uni.createSelectorQuery().select(".store")
.boundingClientRect(function (data) {
that.svHeight = (res.windowHeight - data.top);
console.log("data==", data)
}).exec();
}
});
// #endif
},
onLoad() {
console.log("onLoad(｡･∀･)ﾉﾞ嗨：");
this.getStoreList();
},
async onShow() {
//进首页的时候刷新基本开关
//this.$utils.getBaseConfig();
let isLogin = await this.$utils.isLogin();
this.isLogin = isLogin;
if (this.isLogin) {
//this.getStoreList();//获取问题列表
this.accountId = uni.getStorageSync('accountId')
}
},
/*onReachBottom() {
if (!this.loaded) {
this.loaded = true;
this.pageNumber += 1;
this.getStoreList();
}
},*/
/*onPullDownRefresh(){
this.pageScrollTop = e.scrollTop;
this.storeList=[];
this.pageNumber=1;
this.total=0;
this.loadingType='more';
this.loaded=''
this.getStoreList();
},
onPageScroll(e) {
console.log("下拉刷新");
},*/
//下拉加载
onPullDownRefresh() {
console.log("下拉刷新(●∀●)")
this.pageNumber = 1;
this.total = 0;
this.isLoading = false;
this.storeList = [];
this.getStoreList();
//uni.showNavigationBarLoading;//在导航条进行显示加载动画
//uni.stopPullDownRefresh({});//停止下拉刷新
//uni.hideNavigationBarLoading({});//隐藏导航条加载动画
},
//触底
onReachBottom() {
console.log("我到底了(●'◡'●)");
if (this.pageNumber * this.pageSize >= this.total) {
uni.showMsg('数据加载完毕');
}
if (this.isLoading) {
return;
}
this.pageNumber += 1;
this.getStoreList();
},
methods: {
ah() {
console.log("ahahah!");
},
//获取商品列表
getStoreList: function () {
console.log("getStoreList,我胡汉三来了");
this.isLoading = true;//打开节流阀
let data = {
pageNumber: this.pageNumber,
pageSize: this.pageSize,
sortName: 'createTime',
sortOrder: 'desc',
currentLatitude: uni.服务器托管网getStorageSync('latitude'),
currentLongitude:uni.getStorageSync('longitude')
};
this.$Request.get('storeApi', data).then(res => {
console.log("res===", res);
if (res.data.code === 1) {
console.log("getStoreList,我胡汉在这1");
this.storeList = [...this.storeList,...res.data.data.rows];
this.total = res.data.data.total;
this.pageNumber += 1;
if (this.pageNumber * this.pageSize >= this.total) {
console.log("getStoreList,我胡汉在这1");
uni.showToast({title: '数据加载完毕'});
}
}
this.isLoading = false;//关闭节流阀
uni.hideNavigationBarLoading({});//隐藏导航条加载动画
uni.stopPullDownRefresh({});//停止下拉刷新
data && this.ah();
}, err => {
console.log("err: ", JSON.stringify(err));
})
},
/*getStoreList:function () {
if (this.loadingType === 'loading') {
return;
}
if (this.loadingType !== 'noMore') {
this.loadingType = 'loading';
uni.showNavigationBarLoading(); //显示加载动画
let data = {
pageNumber: this.pageNumber,
pageSize: this.pageSize,
sortName: 'createTime',
sortOrder: 'desc',
currentLatitude: uni.getStorageSync('latitude'),
currentLongitude:uni.getStorageSync('longitude')
/!* currentLatitude:113.693047,
currentLongitude:34.721485,*!/
};
this.$Request.get('storeApi', data).then(res=>{
this.total = res.data.data.total;
this.pageNumber += 1;
uni.hideNavigationBarLoading();
uni.stopPullDownRefresh();
this.loaded = true;
//if (res.data.data.rows) {
this.storeList = this.storeList.concat(res.data.data.rows);
if (this.storeList.length === this.total) {
this.loadingType = 'noMore';
} else {
this.loadingType = 'more';
}
// }
}).catch((err)=>{
console.log("err: ", JSON.stringify(err));
});
}
},*/
//跳转进详情
btnStoreDetail(item) {
this.$utils.jump('/shop/pages/detail/index?id=' + item.id, 'navigateTo');
},
btnStoreAddress: function (item) {
var url = '';
console.log("item:", item);
const address = item.storeAddress;
const latitude = item.storeLatitude;
const longitude = item.storeLongitude;
var hasBaiduMap = plus.runtime.isApplicationExist({pname: 'com.baidu.BaiduMap', action: 'baidumap://'});
var hasAmap = plus.runtime.isApplicationExist({pname: 'com.autonavi.minimap', action: 'androidamap://'});
var urlBaiduMap = 'baidumap://map/marker?location=' + latitude + ',' + longitude + '&title=' + encodeURIComponent(address) + '&src=com.bailb.hbb';
var urlAmap = 'androidamap://viewMap?sourceApplication=com.bailb.hbb&poiname=' + encodeURIComponent(address) + '&lat=' + latitude + '&lon=' + longitude + '&dev=0';
if (hasAmap && hasBaiduMap) {
plus.nativeUI.actionSheet({
title: '选择地图应用',
cancel: '取消',
buttons: [{title: '百度地图'}, {title: '高德地图'}]
}, function (e) {
switch (e.index) {
case 1:
plus.runtime.openURL(urlBaiduMap);
break;
case 2:
plus.runtime.openURL(urlAmap);
break;
}
});
} else if (hasAmap) {
//if (uni.getSystemInfoSync().platform == 'android') {
uni.showModal({
title: '温馨提示',
content: '是否打开“高德地图”进行导航？',
delCancel: false
})
.then(res => {
plus.runtime.openURL(urlAmap);
})
.catch(res => {
});
/* } else {
uni.showModal({
title: '温馨提示',
content: '是否打开“高德地图”进行导航？',
success: res => {
if (res.confirm) {
plus.runtime.openURL(urlAmap);
}
}
});
}*/
} else if (hasBaiduMap) {
//if (uni.getSystemInfoSync().platform == 'android') {
uni.showModal({
title: '温馨提示',
content: '是否打开“百度地图”进行导航？',
delCancel: false
})
.then(res => {
plus.runtime.openURL(urlBaiduMap);
})
.catch(res => {
});
/* } else {
uni.showModal({
title: '温馨提示',
content: '是否打开“百度地图”进行导航？',
success: res => {
if (res.confirm) {
plus.runtime.openURL(urlBaiduMaps);
}
}
});
}*/
} else {
//如果是国外应用，应该优先使用这个，会启动google地图。这个接口不能统一坐标系，进入百度地图时会有偏差
url = 'geo:' + latitude + ',' + longitude + '?q=' + encodeURIComponent(address);
// if (uni.getSystemInfoSync().platform == 'android') {
uni.showModal({
title: '温馨提示',
content: '是否打开“GoogleMap”进行导航？',
delCancel: false
})
.then(res => {
plus.runtime.openURL(url);
})
.catch(res => {
});
/* } else {
uni.showModal({
title: '温馨提示',
content: '是否打开“GoogleMap”进行导航？',
success: res => {
if (res.confirm) {
plus.runtime.openURL(url);
}
}
});
}*/
}
},
btnJump(url) {
this.$utils.jump(url, 'navigateTo');
}
}
};
@import 'index';
/deep/ .select-box {
padding: $uni-padding-base $uni-padding-lg !important;
}
/deep/ .navbar .nav-item.current {
color: $uni-color-black1;
}
/deep/ .navbar .active .txt {
color: $uni-color-black1;
}
/deep/ .store-order .good .imageBox .onShelf {
z-index: 9;
}
/deep/ .navbar {
/*position: static;*/
margin-bottom: $uni-margin-base;
}
分页上拉加载下拉刷新
{{item.articleTitle}}
{{loadingTxt}}
export default {
data() {
return {
filePath: uni.getStorageSync('imageServer'),//图片前缀
list: [], pageNumber: 1, pageSize: 10, total: 0,
isNoMoreData: false,
isLoadAll: false,//加载更多是否显示 loadingTxt: '加载中...',//加载更多的状态 }
}, onLoad(params) {
this.getList();
}, onShow() {
}, onReachBottom(){
console.log("onReachBottom："); this.getList(); }, onPullDownRefresh() {
console.log("onPullDownRefresh："); this.list = []; this.pageNumber = 1; this.getList();
setTimeout(function () {
uni.stopPullDownRefresh(); })
},
methods: {
getList() {
console.log("getList：")
if (this.isNoMoreData) return false; //如果没得下一页了，则不再执行代码
console.log("data：")
let data = {
pageNumber: this.pageNumber, pageSize: this.pageSize, articleTypeCode: '006001', articleState: 1, sortOrder: 'asc', orderBySort: true, }; this.$Request.get(this.$api.page.articleApi, data).then(res => {
console.log("res===", res); if (res.data.code === 1) {
this.list = this.list.concat(res.data.data.rows); this.total = res.data.data.total;
if (this.pageNumber * this.pageSize >= this.total) {
this.isNoMoreData = true;
this.isLoadAll = true; this.loadingTxt = '没有更多数据啦~'; } else {
this.isNoMoreData = f服务器托管网alse; this.pageNumber++;
this.isLoadAll = true; this.loadingTxt = '加载中...'; }
/*if (this.pageNumber * this.pageSize {
console.log("err: ", err); })
}
}
}
@import 'index';
.item {
display: flex; align-items: center; margin: 10px;
.img {
flex: none; width: 100px; height: 100px; border-radius: 8px; }
.info {
flex: 1; margin-left: 10px;
.txt {
font-size: 14px; color: #101010; }
}
}
.loading {
text-align: center; }
服务器托管，北京服务器托管，服务器租用 http://www.fwqtg.net
机房租用，北京机房租用，IDC机房托管， http://www.fwqtg.net
相关推荐: Net 高级调试之二：CLR和Windows加载器及应用程序域介绍
一、简介 今天是 Net 高级调试的第二篇文章，第一篇文章记录了自己学习 Net 高级调试的第一步，认识一些调试工具，有了工具的倚仗，我们开始仗剑走天涯了，开始Net 高级调试正式的征程了。我先说一下，我的文章，【调试测试】这部分一般分为两个部分，第一部…
