为何从QRCodeScanner读取的对象属性访问返回undefined？

你遇到的问题根源在于：e.data是JSON格式的字符串，而非JavaScript对象，所以直接通过.访问内部属性会返回undefined。

验证数据类型 #

先打印e.data的类型确认这一点：

const onSuccess = (e) => {
  console.log(typeof e.data); // 输出应为 "string"
  console.log(e.data);
  setScanData(e.data);
}

解决方案：解析JSON字符串为对象 #

使用JSON.parse()将字符串转换为可操作的JavaScript对象，之后就能正常访问内部属性：

const onSuccess = (e) => {
  try {
    // 解析JSON字符串
    const parsedData = JSON.parse(e.data);
    // 现在可以正常访问属性
    console.log(parsedData.user);
    console.log(parsedData.user.email);
    console.log(parsedData.user.name);
    // 存储解析后的对象
    setScanData(parsedData);
  } catch (error) {
    console.error('JSON解析失败:', error);
    // 处理数据格式错误的情况
  }
}

补充说明 #

QRCodeScanner扫描返回的data字段默认是字符串形式的JSON数据，必须经过解析才能转换为JS对象，进而访问其内部属性。如果解析时出现错误，大概率是扫描到的JSON格式不规范，需要检查二维码中的数据是否符合标准JSON格式。

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