当前位置:首页 > uni-app > 正文内容

微信小程序无法获取Vue.prototype挂载的参数

陈杰1个月前 (05-14)uni-app199

在uniapp中的main.js中我们定义了一个全局的挂载


import request from './common/request.js'

Vue.prototype.request = request


具体看看request中有些什么

export default {
	baseUrl: 'http://api.zhibiaoren.com/',
	uid: '',
	token: '', //header头
	user: '',
	qiniu: null,
	qiniuTick: null,
	weChatLogin: null,
	checkLogin() {},
	
	config: {},

	
	getQiniuStorage() {
		this.qiniu = uni.getStorageSync("qiniu")
		this.getQiniu()
		console.log(this.qiniu);
	},

	getQiniu() {
		this.qiniuTick = setInterval(() => {
			this.post('/index/qiniu_get').then(res => {
				if (res.code == 20000) {
					uni.setStorageSync("qiniu", res.data)
					this.qiniun = res.data
				}
			})
		}, 3000000);
		return this.post('/index/qiniu_get').then(res => {
			if (res.code == 20000) {
				uni.setStorageSync("qiniu", res.data)
				this.qiniu = res.data
			}
			return res
		})

	},
	async post(url, data) {
		let [err, ret] = await uni.request({
			method: 'POST',
			url: this.baseUrl + "api" + url,
			data: data,
			header: {
				token: this.token,
				uid: this.uid,
			}
		})
		if (ret.statusCode !== 200) {
			uni.showToast({
				title: '网络连接错误',
				icon: 'loading'
			})
			return ret.data
		}
		if (ret.data.code == 1000) {
			uni.showToast({
				title: '请先登录',
				icon: 'loading'
			})
			setTimeout(() => {
				uni.navigateTo({
					url: "/pages/public/login"
				})
			}, 1000)
			return ret.data
		}
		if (ret.data.code == 1002) {
			console.log(333);
			setTimeout(() => {
				uni.navigateTo({
					url: "/pages/public/editPassword"
				})
			}, 1000)
			return ret.data
		}
		return ret.data
	},
}


在request中我们定义了一个qiniu变量。

这个变量是通过接口去请求后台获取到我们的七牛云的一些配置,例如七牛云上传地址,七牛云域名,七牛云token等等。


那么再来看看我们的页面中是怎么用的吧

<image :src="request.qiniu.domain + request.qiniu.icon.home" class="header-bg" mode="aspectFill"></image>

我们有一个图片控件,该图片地址是通过qiniu变量的域名加图片key拼接而成的。

在实际测试中,H5和APP端均能显示图片,但是在微信小程序环境中就报undefined。


而且奇怪的是我们应用request.qiniu就报undefinde,但是我们应用request中的其他函数 例如post()方法,就没有任何问题。。


最终的解决方案

data() {
	return {
		request: this.request
	}
},

在页面的data中再次应用request,问题解决

扫描二维码至手机访问

扫描二维码推送至手机访问。

版权声明:本文由何烦过虎溪发布,如需转载请注明出处。

转载请注明出处:http://blog.95shouyou.com/?id=41

分享给朋友:
返回列表

上一篇:uniapp开发微信小程序微信支付实战

没有最新的文章了...

相关文章

uniapp开发微信小程序微信支付实战

前端框架:uniapp后端框架:laravel后端依赖:overtrue/wechat照例我们还是安装一下easywechat依赖composer require overtrue...

发表评论

访客

看不清,换一张

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。