如何在 React Native 中生成具有多个值（如姓名、电子邮件等）的 QR 码答案

【问题标题】：How to generate a QR Code with multiple values like name, email, etc in React Native如何在 React Native 中生成具有多个值（如姓名、电子邮件等）的 QR 码
【发布时间】：2022-02-01 17:08:31
【问题描述】：

我可以使用react-native-qrcode-svg 包创建具有单个值的二维码。但无法添加多个值，如姓名、电子邮件等。

这些我都试过了：

包：

npm install react-native-svg --save
react-native 链接 react-native-svg
npm install react-native-qrcode-svg --save

使用单值生成二维码的代码。

import * as React from 'react';
import QRCode from 'react-native-qrcode-svg';

export default class App extends React.Component {
 render() {
  return (
    <QRCode
      value="Here I want to add name, email,etc"
    />
  );
 };
}

我想生成这样的东西

【问题讨论】：

您有什么需求？二维码就像另一种风格的string，为什么要在一个二维码中添加很多东西？如果你真的需要的话，我可能会建议输入像对象或 JSON 风格的字符串，这样你更容易分析它？

标签： javascript reactjs react-native svg

【解决方案1】：

您可以使用rn-qr-generator 模块创建具有给定字符串的二维码图像。要使用对象生成 QRCode 图像，只需执行以下操作

import RNQRGenerator from 'rn-qr-generator';
 
RNQRGenerator.generate({
  value: JSON.stringify({ email: 'some.email.com', name: 'Name' })
  height: 100,
  width: 100,
  base64: false,            // default 'false'
  backgroundColor: 'black', // default 'white'
  color: 'white',           // default 'black'
})
  .then(response => {
    const { uri, width, height, base64 } = response;
    this.setState({ imageUri: uri });
  })
  .catch(error => console.log('Cannot create QR code', error));

【讨论】：

【解决方案2】：

根据这里的文档，https://www.npmjs.com/package/react-native-qrcode-svg，值可以是一个数组：

String Value of the QR code. Can also accept an array of segments as defined in Manual mode. Ex. [{ data: 'ABCDEFG', mode: 'alphanumeric' }, { data: '0123456', mode: 'numeric' }, { data: [253,254,255], mode: 'byte' }]

因此代码应该是

import * as React from 'react';
import QRCode from 'react-native-qrcode-svg';

export default class App extends React.Component {
 render() {
  return (
    <QRCode
      value="[{ name: 'my name'},{ email: 'email@email.com' }]"
    />
  );
 };
}

【讨论】：

这将作为一个字符串给出，但我想生成类似于问题中显示的二维码。
我已更改代码。检查一次。另外，请仔细阅读文档

【解决方案3】：

我从未使用过 react，但不应该是这样的

value={`"name={name},email={email},phone={phone}"`}

足以计算价值？

【讨论】：

【解决方案4】：

<QRCode
      value={`${email},${mdp}`}
 />

如果你想读取数据：

data=result.split(",")

【讨论】：