移动端混合开发互相调用方法

qq_41562817

于 2024-01-25 10:03:46 发布

阅读量497

点赞数 6

分类专栏： Vue 文章标签：前端 web app javascript

本文链接：https://blog.youkuaiyun.com/qq_41562817/article/details/135836934

版权

Vue 专栏收录该内容

11 篇文章

订阅专栏

本文介绍了如何在H5页面和安卓页面间进行方法调用，包括在Vue中定义方法并将其暴露给安卓，以及Vue通过window调用安卓提供的方法，如`androidCallJsRefresh`和`jsCallAndroid`的使用示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

背景：h5页面与安卓页面需要互相调用方法，作为h5开发人员，需要配合实现vue方法。

一、安卓调用vue方法

methods中定义方法，然后在mounted()将其暴露在window上

  methods: {
    // 刷新列表页
    androidCallJsRefresh() {
      this.pageNum = 1;
      this.boxList = [];
      this.loading = true;
      this.onLoad();
    },
  },
  mounted() {
    window.androidCallJsRefresh = this.androidCallJsRefresh ;
  },

二、vue调用安卓方法

直接在window上调用安卓提供的方法名

  methods: {    
    // 调用退出应用确认框
    abstractLog() {
      window.back.jsCallAndroid()
    },
  }