在混合开发中,HTML界面经常性的需要调用APP端提供的原生方法,而且在很多时候,APP端需要各种回调,如果将所有的回调方法写在内部,不是很方便,而且有些时候,APP端需要定义一些主动触发HTML界面的方法,此时就会出现一个略坑的问题:

如果将该方法写在vue methods内,当APP主动去触发这些方法时,就会发现无法获取到这些方法,导致出错!

针对这个回调问题,在询问了一些同事之后找到问题所在:在APP端主动触发HTML方法的时候,会到window下面去查找该方法,但是如果将方法设置到methods中,就会导致APP端找不到该方法,调用失败,解决方法如下:

将方法定义到window下,代码如下:

// 将方法绑定到window下面,提供给外部调用
mounted(){
window['rightFunctionName'] = () => {
this.getRule(); //回调方法需要执行的代码
/*代码块*/
}
},

采用这种定义方式即可解决APP端调用问题

Vue界面中关于APP端回调方法问题的更多相关文章

  1. Vue.js中组件传参的方法 - 基于webpack模板

    在Vuejs中, 组件之间的传参是今天第一次接触, 之前写的组件互相之间都是独立的, 弗敢专也, 必以分人 环境: node.js npm vue-cli 以上安装请自行百度 一.项目创建 $ vue ...

  2. vue项目中禁止移动端双击放大,双手拉大放大的方法

    在vue打包后生成的dist目录文件下下面有index.html 打开里面 把原来的这个 <meta name=viewport content="width=device-width ...

  3. vue组件中—bus总线事件回调函数多次执行的问题

    在利用vue组件进行事件监听时发现,如果对N个vue组件实例的bus总线绑定同一事件的回调函数,触发任意组件的对应事件,回调函数至少会被执行N次,这是为什么呢? 为此,调研了普通对象的事件绑定和触发实 ...

  4. Vue开发中的移动端适配(px转换成vw)

    1.项目根目录下,创建 .postcssrc.js 文件. 2.安装插件. -D (开发依赖) postcss-import postcss-url cssnano-preset-advanced - ...

  5. 在vue项目中MD5加密的使用方法

    1:安装 npm install --save js-md5 2.引入及使用 方法一:在需要的项目文件中引入 import md5 from 'js-md5'; 使用例子:md5('hello wor ...

  6. axios在vue项目中的一种封装方法

    记录下之前领导封装的axios请求 npm install axios // 安装 单独写个文件配置axios,此处为request.js import axios from 'axios' //自定 ...

  7. vue项目中使用百度地图的方法

    1.在百度地图申请密钥: http://lbsyun.baidu.com/  将 <script type="text/javascript" src="http: ...

  8. vue项目中h5移动端中通过flex布局实现首尾固定,中间滚动(借鉴)

    html中 <div class="flexLayoutr"> <div class="div_head"></div> & ...

  9. vue项目中总结用到的方法。

    依赖 vue-router 获得当前字符串,对应当前路由的路径,总是解析为绝对路径. computed: { productIcon () { return this.imgMap[this.$rou ...

随机推荐

  1. flask 编码问题

    在我们的flask项目中,通过表单提交对数据库进行更新的时候,数据提交不成功,提示以下内容: sqlalchemy.exc.InternalError: (pymysql.err.InternalEr ...

  2. pv回收

    学习cloudman中的k8s 152课,创建pod时,需要在k8s-host2 中挂着到在k8s-master 中/nfs中创建的挂载目录,结果提示没有/nfs/pv1 root@k8s-maste ...

  3. MacOS上使用Openconnect代替Cisco Anyconnect

    OpenConnect是一个Cisco Anyconnect的替代品,具有开源.易获取.可靠等优点.而官方版本的Cisco Anyconnect配置较为繁琐,需要在管理界面同时部署多平台客户端才能支持 ...

  4. 使用Docker-Compose编排发布.Net Core+Redis应用两个镜像到Docker

    对于刚刚完成的Alipay支的Demo, 我想要把它部署到Docker中去, 下面我来演示相关步骤. 创建配置文件 配置文件的重中之重是Dockerfile, 他的内容如下: # 第一部分是编译并发布 ...

  5. [转帖]TPC-C解析系列03_TPC-C基准测试之SQL优化

    TPC-C解析系列03_TPC-C基准测试之SQL优化 http://www.itpub.net/2019/10/08/3330/ TPC-C是一个非常严苛的基准测试模型,考验的是一个完备的关系数据库 ...

  6. RHEL 6.5 安装Docker

    一,配置远程yum源二,下载依赖包1.安装downloadonly插件使用yum下载rpm包2.下载docker需要的依赖包三,安装docker(离线节点)1. 依次执行docker的安装包2. 启动 ...

  7. PAT(B) 1068 万绿丛中一点红(C)

    题目链接:1068 万绿丛中一点红 (20 point(s)) 参考博客:1068. 万绿丛中一点红(20) i逆天耗子丶 题目描述 对于计算机而言,颜色不过是像素点对应的一个 24 位的数值.现给定 ...

  8. Cortex_m7内核cache深入了解和应用

    一,cache概述 从下图可以看出,从M7内核才开始有的cache,这对于从M0,M3,M4一路走来的小伙伴来说,多了一个cache就多了一个障碍. Cortex-M7 core with 32K/3 ...

  9. Shiro简介、入门案例、web容器的集成

    目的: shiro简介 Shiro入门案例 Shiro与web容器的集成 shiro简介(中文官网:https://www.w3cschool.cn/shiro/andc1if0.html) 1.什么 ...

  10. STL中的函数对象实现负数的定义

    // // main.cpp // STL中的函数对象 // // Created by mac on 2019/5/2. // Copyright © 2019年 mac. All rights r ...