1.兼容各端的固定定位
<view class="iconfont icon-chuangzuo edit"></view>
.edit{
width: 80rpx;
height: 80rpx;
background-color: #0199FE;
border-radius: 100%;
display: flex;
justify-content: center;
align-items: center;
color: #ffffff;
font-size: 36rpx;
position: fixed;
bottom: calc(10px + var(--window-bottom));
right: calc(10px + var(--window-right));
z-index: 999;
}
2.上传图片
//添加图像
clickInsertImage() {
uni.chooseImage({
success: async res => {
uni.showLoading({
title: "上传中请稍后",
mask: true
})
for (let item of res.tempFiles) {
let suffix = item.path.substring(item.path.lastIndexOf("."));
let randomName = Date.now() + "" + String(Math.random()).substr(3, 6) + suffix
let res = await uniCloud.uploadFile({
filePath: item.path,
cloudPath: item.name || randomName
})
this.editorCtx.insertImage({
src: res.fileID
})
}
uni.hideLoading()
}
})
},
3.高德地图web服务(IP定位):https://lbs.amap.com/api/webservice/summary
//获取所在省市
function getIp(){
return new Promise((resolve,reject)=>{
uni.request({
url:"https://restapi.amap.com/v3/ip?key=4a43fb1fc001e386a52215b6feea63f4",
success:res=>{
let str=""
typeof(res.data.province) == "string" ? str=res.data.province :str="火星"
resolve(str)
let obj={
province:str,
time:Date.now()
}
uni.setStorageSync("historyProvince",obj);
},
fail:err=>{
reject(err)
}
})
})
}
4.查询数据库
用jql
getData() {
let artice = db.collection("artice").getTemp()
let user = db.collection("uni-id-users").field('_id, username, nickname, avatar_file').getTemp()
db.collection(artice, user).get().then(res => {
this.list = res.result.data
console.log(this.list);
})
},
用前端组件
<unicloud-db v-slot:default="{data, loading, error, options}" collection="article, uni-id-users"
field="_id,publish_date,title,description,picurls, user_id{_id,nickname,avatar_file}">
<view v-if="error">{{error.message}}</view>
<view v-else>
<view class="item" v-for="(item, index) in data" :key="index">
<blog-item :item="item"></blog-item>
</view>
</view>
</unicloud-db>