1、跳转页面。
uni.navigateTo({
url: '/pages/login/index?navback=1'
});
//传递多个参数例子
uni.navigateTo({
url: '/mall/shopcart/productDetail?id=' + id + '&merchantId=' + ids.merchantId +
'&priceStr=' + priceStr + '&name=' + name + '&power=' + this.power +
"&powerId=" +
this.powerId + '&picUrl=' + picUrl + '&isMall=' + this.isMall
})
//回传
let pages = getCurrentPages()
let prevPage = pages[pages.length -2]
prevPage.$vm.getSelectObjValue(this.ids)
uni.navigateBack({delta:1})
//获取返回参数方法
getSelectObjValue(val) {
}
Back(){
//uni.navigateBack()//默认delta:1
uni.navigateBack({
delta:1,//返回层数，2则上上页
})
},
2、获取跳转参数
onLoad(options) {
let id = options.id
}
3、页面声明周期
onLoad(){
}
onShow(){
}
onHide(){
}
onUnload(){
}
4、获取当前时间
this.startTime = Date.now();
5、本地数据的存储
//取出
uni.getStorageSync('userInfo');
//保存
uni.setStorageSync('userInfo', true);
//删除
uni.removeStorage('userInfo')
//异步获取结果
uni.getStorage({
key: 'userMerchant',
success: function(res) {
}
})
6、安卓app权限操作
例如获取定位权限时，弹出请求权限弹框，被拒绝后弹出引导开启权限弹框。
//可到uni-app官方demo中拷贝该文件
// #ifdef APP-PLUS
import permision from "@/common/permission.js"
// #endif
let status = await this.checkPermission();
if (status !== 1) {
return;
}
uni.getLocation({
type: 'gcj02',
success: function(res) {
console.log(res.latitude);
this.lat = res.latitude
this.lng = res.longitude
uni.navigateTo({
url: '../store/choose-location?pagetype=index&lat=' + this.lat + '&lng=' +
this.lng
})
}
});
async checkPermission() {
let status = permision.isIOS ? await permision.requestIOS('location') :
await permision.requestAndroid('android.permission.ACCESS_FINE_LOCATION');
if (status === null || status === 1) {
status = 1;
} else if (status === 2) {
uni.showModal({
content: "系统定位已关闭",
confirmText: "确定",
showCancel: false,
success: function(res) {
}
})
} else if (status.code) {
uni.showModal({
content: status.message
})
} else {
uni.showModal({
content: "需要定位权限",
confirmText: "设置",
success: function(res) {
if (res.confirm) {
permision.gotoAppSetting();
}
}
})
}
return status;
}
在提交应用市场时，对权限检测很严格，uniapp在manifest中可以配置启动时获取权限，我们需要关闭。request改为none。
image.png
7、vue动态样式
<view :class="status == 1?'top':'top1'" @click="show = true">
<style>
.top{
xxx
}
.top1{
xxx
}
</style>
8、uniapp中使用iconfont图标。
参考：【小程序开发】uniapp引入iconfont图标及使用方式_uniapp icon-CSDN博客
操作完后需要重启项目
9、uniapp使用vuex的store
步骤一：在项目添加store文件夹，然后定义index.js文件
image.png
import Vue from 'vue'
import Vuex from 'vuex'
import $mRoutesConfig from '@/config/routes.config.js'
import $mRouter from '@/common/router.js'
const TOKEN = uni.getStorageSync("token") || "";
const OPENID = uni.getStorageSync("openId") || "";
const USER_INFO = uni.getStorageSync("userInfo") || {};
const CUSTOMER_INFO = uni.getStorageSync("customerInfo") || {};
const taskCategory = uni.getStorageSync("taskCategory") || {};
const DIRECTMERCHANT = uni.getStorageSync("directMerchant") || {}
const WXPAYENABLE = uni.getStorageSync("wxPayEnable") || ""
Vue.use(Vuex)
import api from '@/util/api'
const store = new Vuex.Store({
modules: {},
plugins: [
// createPersistedState({
// storage: plus.storage
// })
],
state: {
lastTime: new Date().getTime(),
lb: false,
show: true,
PK2: 'QUAA4GNADCBiQKBgQCmQ',
hasLogin: false,
appAd: 'uni',
//userInfo: {},
// 是否強制登录
forcedLogin: true,
// 前端token
token: TOKEN,
// 用户信息 头像 昵称
userInfo: USER_INFO,
// 用户的商户信息
customerInfo: CUSTOMER_INFO,
operatingSystem: '',
requestList: [], // 网络请求队列
goodsCartList: [], // 自营购物车列表
goodsCartTotal: {}, // 自营购物车总数
taskCategory: taskCategory, // 任务类目
directMerchant: DIRECTMERCHANT, //被锁的人的上级信息
plantInfo: {}, //工厂商户信息
wxPayEnable: WXPAYENABLE,
// tabbar:TABBARs ,
tabbar: [{
pagePath: "/pages/home/index",
iconPath: "/static/tabBar/home.png",
selectedIconPath: "/static/tabBar/home-active.png",
text: "首页"
},
{
pagePath: "/pages/sort/index",
iconPath: "/static/tabBar/category.png",
selectedIconPath: "/static/tabBar/category-active.png",
text: "分类"
},
{
pagePath: "/pages/store/index",
iconPath: "/static/tabBar/shop.png",
selectedIconPath: "/static/tabBar/shop-active.png",
text: "门店"
},
{
pagePath: "/customerService/list/list",
iconPath: "/static/tabBar/cart.png",
selectedIconPath: "/static/tabBar/cart-active.png",
text: "购物车"
},
],
tabbar2: [{
"pagePath": "/pages/home/index",
"iconPath": "/static/tabBar/home.png",
"selectedIconPath": "/static/tabBar/home-active.png",
"text": "首页"
},
{
"pagePath": "/pages/sort/index",
"iconPath": "/static/tabBar/category.png",
"selectedIconPath": "/static/tabBar/category-active.png",
"text": "分类"
},
{
"pagePath": "/pages/store/index",
"iconPath": "/static/tabBar/shop.png",
"selectedIconPath": "/static/tabBar/shop-active.png",
"text": "门店"
},
{
"pagePath": "/customerService/list/list",
"iconPath": "/static/tabBar/news.png",
"selectedIconPath": "/static/tabBar/news-active.png",
"text": "消息",
count: 0,
},
{
"pagePath": "/pages/my/index",
"iconPath": "/static/tabBar/user.png",
"selectedIconPath": "/static/tabBar/user-active.png",
"text": "我的",
}
],
tabbar3: [{
"pagePath": "/pages/home/index",
"iconPath": "/static/tabBar/home.png",
"selectedIconPath": "/static/tabBar/home-active.png",
"text": "首页"
},
{
"pagePath": "/pages/sort/index",
"iconPath": "/static/tabBar/category.png",
"selectedIconPath": "/static/tabBar/category-active.png",
"text": "分类"
},
{
"pagePath": "/customerService/list/list",
"iconPath": "/static/tabBar/news.png",
"selectedIconPath": "/static/tabBar/news-active.png",
"text": "消息",
count: 0,
},
{
"pagePath": "/pages/my/index",
"iconPath": "/static/tabBar/user.png",
"selectedIconPath": "/static/tabBar/user-active.png",
"text": "我的",
}
]
},
getters: {
// 用户是否登录
hasLogin: state => {
if (state.token && state.userInfo) {
return true;
} else {
return false
}
}
},
mutations: {
lastTimeUpdata: (state, lastTime) => {
console.log("lastTimeUpdata")
state.lastTime = lastTime;
},
getShow(state, data) {
state.show = data
},
setlb(state, data) {
state.lb = data
},
login(state, provider) {
state.hasLogin = true;
state.userInfo = provider;
uni.setStorage({ //缓存用户登陆状态
key: 'userInfo',
data: provider
})
},
logout(state) {
state.hasLogin = false;
state.userInfo = {};
uni.removeStorage({
key: 'userInfo'
})
},
SET_TOKEN(state, token) {
state.token = token;
uni.setStorageSync("token", token);
},
SET_OPENID(state, openId) {
state.openId = openId;
uni.setStorageSync("openId", openId);
},
SET_USERINFO(state, userInfo) {
let data = Object.assign(state.userInfo, userInfo)
state.userInfo = data;
uni.setStorageSync("userInfo", data);
},
//没用到,先留着
SET_PLANTINFO(state, plantInfo) {
let data = Object.assign(state.plantInfo, plantInfo)
state.plantInfo = data;
uni.setStorageSync("plantInfo", data);
},
SET_CUSTOMERINFO(state, customerInfo) {
state.customerInfo = customerInfo;
uni.setStorageSync("customerInfo", customerInfo);
},
SET_LOGOUT(state) {
state.token = "";
state.userInfo = {}
uni.setStorageSync("userInfo", {});
uni.setStorageSync("token", "");
},
SET_APPAD(state, appAd) {
state.appAd = appAd;
uni.setStorageSync("appAd", appAd);
},
UPDATA_GOODS_CART(state) {
let mobile = state.userInfo.mobile || ''
if (mobile) {
let obj = {
mobile
}
getWlkIndex(state, obj)
}
},
SET_CART_TOTAL(state, list) {
state.goodsCartTotal = list;
},
SET_GOODS_CART(state, list) {
state.goodsCartList = list;
},
SET_TASK_CATEGORY(state, list) {
state.taskCategory = list;
uni.setStorageSync("taskCategory", list);
},
SET_MERCHANT(state, list) {
state.directMerchant = list
uni.setStorageSync("directMerchant", list);
}
},
actions: {
// 登录过期 重新登录
reLogin({
commit
}, info) {
commit("SET_TOKEN", "");
$mRouter.redirectTo({
route: $mRoutesConfig.login
});
}
}
})
export default store
步骤二：
引入
import {mapState} from 'vuex';
computed: {
...mapState(['userInfo','plantInfo']),
tabbar: function() {
if (this.isShoppingGuide) {
return this.$store.state.tabbar
} else {
if (this.isNoLogin) {
return this.$store.state.tabbar3
} else {
return this.$store.state.tabbar2
}
}
},
}
this.$store.commit("SET_USERINFO", userInfo || {});
10、全局常量
在main.js文件中
//定义如下
Vue.prototype.img_src = 'https://xxxxx.oss-cn-shenzhen.aliyuncs.com/'
uni.img_src = 'https://xxxx.oss-cn-shenzhen.aliyuncs.com/'
//data域中引入
data() {
return {img_src: this.img_src}
}
