小程序页面为空白怎么解决

小程序页面为空白怎么解决

小程序页面为空白,可以设计一个“临时加载页”来解决,方法如下:

1.在app.json中,创建一个新的page,命名为welcome,代码:"pages/welcome/welcome"(注意该page要放置在进入小程序的第一个页面)

2.在welcome.js中,将具体请求操作写入到onload中,代码:

//pages/welcome/welcome.js

Page({

data:{},

onLoad:function(options){

//页面初始化options为页面跳转所带来的参数

varthat=getApp()

try{

//首先检查缓存中是否有我们需要请求的数据,如果没有,我们再跟服务器连接,获取数据

//首次登陆肯定是没有的

that.globalData.userInfo=wx.getStorageSync('userInfo')

if(wx.getStorageSync('userInfo')!=''){

//如果缓存不为空,即已经存在数据,我们不用再跟服务器交互了,那么直接跳转到首页

wx.switchTab({

url:'../index/index',

})

}

if(value){

//Dosomethingwithreturnvalue

console.log(that.globalData.userInfo)

}

}catch(e){

//Dosomethingwhencatcherror

//当try中的缓存数据不存在时,将跳到这步,这步中,我们将与服务器进行连接,并获取数据

if(that.globalData.userInfo==''){

wx.login({

success:function(res){

//获取用户code,转发到我们的服务器,再在我们服务器与微信交互,获取openid

varcode=res.code

wx.getUserInfo({

success:function(userInfo){

varencryptedData=userInfo.encryptedData

variv=userInfo.iv

//我们服务器请求地址

varurl=that.apiHost+'index/login'

varuserinfo=userInfo.userInfo

varusername=userinfo.nickName

varuseravatar=userinfo.avatarUrl

varusersex=userinfo.gender

wx.request({

url:url,

method:'POST',

data:{

'code':code,

'username':username,

'useravatar':useravatar,

'usersex':usersex

},

header:{

"Content-Type":"application/x-www-form-urlencoded"

},

success:function(response){

//数据交互成功后,我们将服务器返回的数据写入全局变量与缓存中

console.log(response.data)

//写入全局变量

that.globalData.userInfo=response.data

wx.hideToast()

//写入缓存

wx.setStorage({

key:'userInfo',

data:that.globalData.userInfo,

success:function(res){

console.log("insertsuccess")

},

fail:function(){

//fail

},

complete:function(){

//complete

}

})

//写入后,我们将跳转到主页

wx.switchTab({

url:'../index/index',

})

},

failure:function(error){

console.log(error)

},

})

}

})

}

})}

}

},

onReady:function(){

//页面渲染完成

},

onShow:function(){

//页面显示

},

onHide:function(){

//页面隐藏

},

onUnload:function(){

//页面关闭

},

redirect:function(){

wx.switchTab({

url:'../index/index',

})

}

})

3.写好发布后,首次登陆时,将进入我们的欢迎界面,当用户确认公开信息后,页面将自动跳转到首页,首页数据就会正常显示。

了解更多小程序页面为空白怎么解决相关的解答,就上多想派(www.duoxiangpai.com)。

本文章由用户七点生活分享,版权归原作者,如侵犯,请联系(点这里联系),经核实,我们将第一时间删除。如若转载,请注明出处:https://www.duoxiangpai.com/64116.html

(0)

相关推荐