消息提示封装
wx.showToast({
title: '成功',
icon: 'success',
duration: 2000
})
封装后调用方式
1.模块化方式导入使用
import {toast} from "./utils/extendApi"
toast()
toast({title:"数据加载失败...",mask:true})
2.将封装的模块挂载到 wx全局对象上
wx.toast()
wx.toast({title:"数据加载失败...",mask:true})
// extendApi.js
const toast=({title="数据加载中...",icon="none",duration=2000,mask=true}={})=>{
wx.showToast({
title,
icon,
duration,
mask
})
}
wx.toast=toast // 将toast挂载到全局微信对象上
export {
toast,
}
模态对话框封装
const modal=(options={})=>{
return new Promise(resolve=>{
// 默认参数
const defaultOption={
title:"提示",
content:"您确定执行该操作吗?",
confirmColor:"#f3514f",
}
const opts=Object.assign({},defaultOption,options)
wx.showModal({
...opts,
complete ({confirm,cancel}) {
confirm&&resolve(true);
cancel&&resolve(false);
}
})
})
}
extendApi.js完整代码
// 在使用toast方法时,可以传入参数,也可以不传入参数
// const toast=(options={})=>{}
const toast=({title="数据加载中...",icon="none",duration=2000,mask=true}={})=>{
wx.showToast({
title,
icon,
duration,
mask
})
}
const modal=(options={})=>{
return new Promise(resolve=>{
// 默认参数
const defaultOption={
title:"提示",
content:"您确定执行该操作吗?",
confirmColor:"#f3514f",
}
const opts=Object.assign({},defaultOption,options)
wx.showModal({
...opts,
complete ({confirm,cancel}) {
confirm&&resolve(true);
cancel&&resolve(false);
}
})
})
}
wx.toast=toast // 将toast挂载到全局微信对象上
wx.modal=modal
export {
toast,
modal,
}
本地存储封装
官方文档:数据缓存 / wx.setStorageSync (qq.com)
同步API封装
export const setStorage = (key,value) => {
try{
wx.setStorageSync(key, value)
}catch(error){
console.error(`存储指定${key}数据发生了异常`,error);
}
}
export const getStorage= (key) =>{
try{
return wx.getStorageSync(key);
}catch(error){
console.error(`读取指定${key}数据发生了异常`,error);
}
}
export const removeStorage = (key) => {
try{
wx.removeStorageSync(key);
}catch(error){
console.error(`移除指定${key}数据发生了异常`,error);
}
}
export const clearStorage = () => {
try{
wx.clearStorageSync()
}catch(error){
console.error(`清空数据发生了异常`,error);
}
}
异步API封装
export const asyncSetStorage = (key,data,encrypt=false) => {
return new Promise((resolve)=>{
wx.setStorage({
key,
data,
encrypt,
complete(res){
resolve(res);
}
})
})
}
export const asyncGetStorage = (key,encrypt=false) => {
return new Promise((resolve)=>{
wx.getStorage({
key,
encrypt,
complete(res){
resolve(res);
}
})
})
}
export const asyncRemoveStorage = (key) => {
return new Promise((resolve)=>{
wx.removeStorage({
key,
complete(res){
resolve(res);
}
})
})
}
export const asyncClearStorage = (key) => {
return new Promise((resolve)=>{
wx.clearStorage({
complete(res){
resolve(res);
}
})
})
}
storage.js
export const setStorage = (key,value) => {
try{
wx.setStorageSync(key, value)
}catch(error){
console.error(`存储指定${key}数据发生了异常`,error);
}
}
export const getStorage= (key) =>{
try{
return wx.getStorageSync(key);
}catch(error){
console.error(`读取指定${key}数据发生了异常`,error);
}
}
export const removeStorage = (key) => {
try{
wx.removeStorageSync(key);
}catch(error){
console.error(`移除指定${key}数据发生了异常`,error);
}
}
export const clearStorage = () => {
try{
wx.clearStorageSync()
}catch(error){
console.error(`清空数据发生了异常`,error);
}
}
export const asyncSetStorage = (key,data,encrypt=false) => {
return new Promise((resolve)=>{
wx.setStorage({
key,
data,
encrypt,
complete(res){
resolve(res);
}
})
})
}
export const asyncGetStorage = (key,encrypt=false) => {
return new Promise((resolve)=>{
wx.getStorage({
key,
encrypt,
complete(res){
resolve(res);
}
})
})
}
export const asyncRemoveStorage = (key) => {
return new Promise((resolve)=>{
wx.removeStorage({
key,
complete(res){
resolve(res);
}
})
})
}
export const asyncClearStorage = (key) => {
return new Promise((resolve)=>{
wx.clearStorage({
complete(res){
resolve(res);
}
})
})
}