VR全景图片 测试用例 电力杆 个人收款码 HTTP请求 状态模式 flask safari grep Browserify ai视频教程下载 click事件 大数据驾驶舱 edate函数的使用方法 hash怎么下载 svn安装后右键不显示 python线程 python查找指定字符 java正则 java写入文件 java方法重载 java接口的使用 java中string的方法 java连接mysql的jar包 linux安装教程 php实例 dll文件下载 jb51 华为线刷工具 java语言程序设计 eclipse中文版下载 网络克隆 复制到剪贴板 微信小程序开发实例 js动态添加元素 html5制作 vs2008中文版下载 五子棋大师 qq农场图标 ps平面广告设计教程
当前位置: 首页 > 学习教程  > 编程语言

vue中使用apicloud时遇到的问题

2020/10/16 18:27:19 文章标签:

最近用vue做了一个网站,网站里有分享,支付等功能。因为需要在app中调用这个网站,但跟同事沟通知道APP是用apicloud做的,支付分享等这些功能都需要使用APP的接口去做。所以牵涉到在vue页面中使用apicloud去做功能。 一、判断是否是…

最近用vue做了一个网站,网站里有分享,支付等功能。因为需要在app中调用这个网站,但跟同事沟通知道APP是用apicloud做的,支付分享等这些功能都需要使用APP的接口去做。所以牵涉到在vue页面中使用apicloud去做功能。

一、判断是否是APP

网站原先的逻辑不变,只需要在APP的情况下去请求APP接口写一套逻辑。这就需要判断网站当前环境是否是APP。

最先使用的是vue的页面中,在mounted函数里写了这样一段代码:

然后在methods中写了一个函数

想着在APP的环境下改变变量isapp(isapp初始值为null)的值,在需要用的时候判断变量值可以执行针对APP的逻辑代码。但事实不是这样,isapp的值未改变,因为根本没有注入apiready,_this,isapp = 'app'这句代码不会运行。之后经过度娘的帮助,才知道要写成这样:

var _this = this;
mounted(){
    window.apiready = function(){
        _this.isapp = 'app';
    }
}

apiready前要加window。

我之前没有用过apicloud,问同事后说apicloud在页面初始化时会注入一个apiready对象,vue也是一个实例化对象,这两者可能是同级别的,之前的写法可能是把apiready当成是vue下的对象了,所以不成功。(我们2个一个对vue不熟悉,一个对apicloud不熟悉,只是根据自己的理解这样猜测的,不一定正确哈)。

二、如何在所有vue组件使用apiready

按第一步的方法是成功注入apiready了,可以判断是APP的环境了,但我刚开始是在app.vue的页面中使用没有问题,但在其他组件页面按照window.apiready使用发现都不起作用。也是问过同事后得知apiready只在页面中执行一次,vue是单页面应用,app.vue是入口文件,各个组件页面编译后实际上只存在一个html页面。所以只要app.vue里的apiready成功了。

了解这个,就要想办法把在执行apiready后改变的变量传入其他组件,让其他组件都能使用。vue里可以设置全局变量,代码如下:

在main.js文件中加入这段代码 

//注入apiready,设置Vue全局变量isapp
window.apiready = function() {
	Vue.prototype.isapp = 'app';
}

这样vue的全局变量isapp就设置成功了,可以在其他组件页面使用。获取此变量时直接this.isapp就行。


本文链接: http://www.dtmao.cc/news_show_300431.shtml

附件下载

相关教程

    暂无相关的数据...

共有条评论 网友评论

验证码: 看不清楚?