有关vue 开发钉钉 H5 微应用 dd.ready() 不执行问题及快速解决方案

 更新时间:2020年05月09日 11:42:22   作者:随风...  
这篇文章主要介绍了有关vue 开发的钉钉 H5 微应用 dd.ready() 不执行问题及快速解决方案,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

最近在做钉钉的免登,npm 安装好 dingtalk-jsapi 后,执行 dd.ready()怎么都不生效。但是判断当前环境是不是 ‘notInDingTalk' 时又是有效的。花了很长时间,一直找不到原因。后来无意中发现别人的代码似乎跟我有一点差异,于是抱着死马当活马医的心态试试,结果真的有效。

废话不多说,原因在于从官网复制的代码里 的匿名函数function(){},在vue开发里是无效的,需要改成 箭头函数 () =>{}
修改之前的:

修改之前

这个 ‘this.userCode' 是临时修改成用于测试有没有进入 dd.ready() 的,不要在意这些细节。
如果正常的话,this.userCode 应该显示 :“开始执行ready 进入了钉钉 获取授权码成功”但是实际上只显示了:“开始执行ready“修改后:

修改后

终于如愿显示授权码了:

在这里插入图片描述

贴上代码:

 if (dd.env.platform !== "notInDingTalk") {
 this.userCode += '开始执行ready ';
 //进行钉钉登录操作
 dd.ready(() => {
 this.$Message.info('1')
 this.userCode = '进入了钉钉 ';
 dd.runtime.permission.requestAuthCode({
 corpId: corpId, // 企业id
 onSuccess: (info) => {
  //todo: 测试获取授权码
  this.userCode += " 获取授权码成功 ";
  this.userCode += info.code // 通过该免登授权码可以获取用户身份
 },
 onFail: (error) => {
  this.userCode += " 获取授权码失败 ";
  console.log('好吧,问题不小')
  this.$Message.error(JSON.stringify(error))
 }
 });
 });

总结

到此这篇关于有关vue 开发的钉钉 H5 微应用 dd.ready() 不执行问题及快速解决方案的文章就介绍到这了,更多相关vue 钉钉微应用 dd.ready() 不执行内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 在Vue开发过程中解决和预防内存泄漏问题的方法详解

    在Vue开发过程中解决和预防内存泄漏问题的方法详解

    Vue作为一款流行的前端框架,已经在许多项目中得到广泛应用,然而,随着我们在Vue中构建更大规模的应用程序,我们可能会遇到一个严重的问题,那就是内存泄漏,因此,我们需要认识到在Vue开发过程中,内存泄漏问题的重要性,本文将给大家介绍如何解决和预防内存泄漏问题
    2023-10-10
  • vue3数据更新而视图未更新问题解决

    vue3数据更新而视图未更新问题解决

    本文主要介绍了vue3 解决数据更新而视图未更新问题,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-10-10
  • vue-router中关于children的使用方法

    vue-router中关于children的使用方法

    这篇文章主要介绍了vue-router中关于children的使用方法,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-08-08
  • 60个vue常用工具类

    60个vue常用工具类

    这篇文章主要介绍了60个vue常用工具类,包括vue邮箱验证,vue浏览器识别,vue操作系统识别,vue html过滤,vue身份证校验等需要的朋友可以参考下
    2023-01-01
  • ElementUI中两个Select选择联动效果实现方法

    ElementUI中两个Select选择联动效果实现方法

    这篇文章主要给大家介绍了关于ElementUI中两个Select选择联动效果实现的相关资料,在前端项目开发中,经常会遇到省市县三级联动的下拉列表框组的问题,需要的朋友可以参考下
    2023-08-08
  • vue+express+jwt持久化登录的方法

    vue+express+jwt持久化登录的方法

    这篇文章主要介绍了vue+express+jwt持久化登录的方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-06-06
  • Vue实现仿iPhone悬浮球的示例代码

    Vue实现仿iPhone悬浮球的示例代码

    这篇文章主要介绍了Vue实现仿iPhone悬浮球的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-03-03
  • el-element中el-table表格嵌套el-select实现动态选择对应值功能

    el-element中el-table表格嵌套el-select实现动态选择对应值功能

    这篇文章主要给大家介绍了关于el-element中el-table表格嵌套el-select实现动态选择对应值功能的相关资料,文中通过实例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2023-01-01
  • 如何实现双向绑定mvvm的原理实现

    如何实现双向绑定mvvm的原理实现

    这篇文章主要介绍了vue双向数据绑定原理,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-05-05
  • vue3.0手动封装分页组件的方法

    vue3.0手动封装分页组件的方法

    这篇文章主要为大家详细介绍了vue3.0手动封装分页组件的方法,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-09-09

最新评论