uni-app调用支付宝插件报错（Cannot read properties of undefined (reading 'data-com-type')）

发布于 1周前 作者 phonegap100 来自 Uni-App

uni-app调用支付宝插件报错（Cannot read properties of undefined (reading ‘data-com-type’)）

reading ‘data-com-type’)/TypeError: Cannot read properties of undefined (reading ‘data-com-type’)

不影响插件功能，但是会有报错被支付宝后台记录

查看报错详情，支付宝小程序为什么会有个data-com-type === 'wx’的判断，求指点

报错地点：node-module/@dcloudio/uni-mp-alipay/dist/index.js

顺便再贴一个另外一个大佬的相同问题
https://ask.dcloud.net.cn/question/132498

这里是组件的调用

<student-verify  
ref="onStudentVerifyRef"  
shopName="shopName"  
shopLink="shopLink"  
shopLogo="shopLogo"  
onSuccess="onSuccess"  
/>

image


Harmonyos Next教程
12 回复

你好，你是 uniapp 出现这个问题，还是你使用的插件出现这个问题？


调用的是支付宝学生认证插件，咨询过官方了，他们查过与插件无关 在网上还看到类似问题，没有回复 https://ask.dcloud.net.cn/question/132498

回复 p***@163.com: 这个光看这里也看不出来是不是 uniapp 编译的问题，你可以尝试打断点确认一下具体内容。

回复 DCloud_UNI_yuhe: 断点已经打过了的 其实我比较奇怪的是【ref.props[‘data-com-type’] === ‘wx’】data-com-type是什么东西，按理说支付宝插件不会出现这种带有wx字样的东西

回复 p***@163.com: 你好，我这里没有办法直接引入这个插件，你可以提供一个更通用的，可以复现这个问题的插件吗？或者是可以提供一个可以复现的项目吗？

回复 DCloud_UNI_yuhe: 最近又排查了下哈 在node-module/@dcloudio/uni-mp-alipay/dist/index.js这个文件会有data-com-type的判断

function handleRef (ref) { if (!ref) { return } if (ref.props[‘data-com-type’] === ‘wx’) { const eventProps = {}; let refProps = ref.props; // 初始化支付宝小程序组件事件 Object.keys(refProps).forEach(key => { const handler = refProps[key]; const res = key.match(/^on([A-Z])(\S*)/); if (res && typeof handler === ‘function’ && handler.name === ‘bound handleEvent’) { const event = res && (res[1].toLowerCase() + res[2]); refProps[key] = eventProps[key] = function () { const props = Object.assign({}, refProps); props[key] = handler; // 由于支付宝事件可能包含多个参数，不使用微信小程序事件格式 delete props[‘data-com-type’]; triggerEvent.bind({ props })(event, { args: […arguments] }); }; } });

回复 p***@163.com: 就是比较奇怪 为什么支付宝会有判断等于wx字样

联系插件作者问问

https://ask.dcloud.net.cn/question/132498 类似这个问题 写的很清楚

联系过支付宝官方了 与他们无关

针对您提到的uni-app调用支付宝插件报错（Cannot read properties of undefined (reading ‘data-com-type’)）的问题，这通常是由于尝试访问一个未定义对象的属性所导致的。在uni-app中使用支付宝插件时，确保您已经正确安装并配置了相关插件，并且在使用插件API时，相关的对象或参数已经正确初始化。

以下是一个简化的代码示例，展示如何在uni-app中调用支付宝插件进行支付，同时确保对象的使用是安全的：

// 1. 首先确保在manifest.json中配置了支付宝插件的相关信息
// {
//   "mp-alipay": {
//     "appid": "your-alipay-appid",
//     "setting": {
//       "urlCheck": false
//     }
//   }
// }

// 2. 在页面中调用支付宝插件
export default {
  methods: {
    // 发起支付请求
    requestAlipayPayment() {
      // 获取uni-app的支付接口
      const alipay = uni.requireNativePlugin('AlipayJSBridge');

      // 模拟支付订单信息
      const orderString = {
        // 这里填写您从服务器获取的支付宝订单字符串
        // 例如: 'app_id=2015052600000001&biz_content={"out_trade_no":"20150320010101001","product_code":"QUICK_MSECURITY_PAY","total_amount":"88.88","subject":"Iphone6 16G","body":"Iphone6 16G"}&charset=utf-8&method=alipay.trade.app.pay&notify_url=https%3A%2F%2Fsms.alipay.dev%2Fgateway.do&sign=XXXXXX&sign_type=RSA2&timestamp=2015-04-01 11%3A31%3A39&version=1.0'
      };

      // 安全调用插件，避免undefined错误
      if (alipay) {
        alipay.call('tradePay', {
          orderString: orderString
        }, (res) => {
          if (res.resultCode === 9000) {
            console.log('支付成功');
          } else {
            console.error('支付失败', res);
          }
        });
      } else {
        console.error('支付宝插件未定义');
      }
    }
  },
  onLoad() {
    this.requestAlipayPayment();
  }
}

在上述代码中，我们首先检查alipay对象是否存在，然后再调用其call方法。这是一种避免Cannot read properties of undefined错误的常见做法。同时，确保orderString是有效的，并且是从您的服务器安全获取的支付宝订单信息。

如果问题仍然存在，请检查以下几点：

  • 确保支付宝插件已经正确安装并配置在manifest.json中。
  • 检查orderString的格式和内容是否正确。
  • 查看控制台是否有其他相关错误信息，以便进一步定位问题。
回到顶部