Ionic4来电姓名播报应用报错：Cannot read property 'contact' of null

我帮你拆解下问题根源，再一步步给出解决方案：

核心问题分析 #

你遇到的错误本质是回调函数里的this指向异常：在PhoneCallTrap.onCall()的传统function回调中，内部this并不指向你的Ionic组件实例，而是回调自身的上下文，导致this.contact变成了null，调用find方法时就触发了报错。

另外还有个小坑：contact.find()是异步操作，你在它外部直接执行alert("well well: " + this.contactsfoundcallingNumber)的话，此时联系人数据还没返回，这个值肯定是未赋值的状态。

修复方案 #

1. 用箭头函数修正this指向 #

把回调改成箭头函数，这样this会继承外部组件的上下文，就能正确访问this.contact了。

2. 调整异步逻辑的执行顺序 #

把需要用到联系人结果的操作放到then()回调内部，确保拿到数据后再执行后续逻辑。

修改后的完整代码如下：

phonecalls() { 
  PhoneCallTrap.onCall((obj) => { // 替换成箭头函数
    alert("CHANGE STATE: " + obj.state); 
    var callObj = JSON.parse(obj), state = callObj.state, callingNumber = callObj.incomingNumber; 
    console.log("obj: " + obj); // working 
    alert("callingNumber STATE: " + callingNumber); 
    // 联系人查询配置
    const options = new ContactFindOptions(); 
    options.filter = callingNumber; 
    options.multiple = true; 
    options.hasPhoneNumber = true; 
    // 执行联系人查找
    this.contact.find(['*'], options).then((contacts) => { 
      // 用可选链避免无匹配联系人时报错
      this.contactsfoundcallingNumber = contacts[0]?.displayName; 
      console.log(JSON.stringify(contacts[0])); 
      // 把依赖联系人数据的操作移到这里
      alert("well well: " + this.contactsfoundcallingNumber);
    }).catch(err => {
      // 捕获查询错误，方便调试
      console.error("联系人查找失败:", err);
      alert("无法获取来电联系人信息");
    }); 

    switch (state) { 
      case "RINGING": 
        console.log("Phone is ringing", callingNumber); 
        break; 
      case "OFFHOOK": 
        console.log("Phone is off-hook"); 
        break; 
      case "IDLE": 
        console.log("Phone is idle"); 
        break; 
    } 
  }); 
}

额外检查项 #

• 确认已正确安装配置Cordova联系人插件：ionic cordova plugin add cordova-plugin-contacts，并在app.module.ts中导入Contacts模块。
• 权限验证：Android需确保申请了READ_CONTACTS权限，iOS要在Info.plist中添加NSContactsUsageDescription权限说明，且用户已授权应用访问联系人。

内容的提问来源于stack exchange，提问作者user9088454