reactjs - 如何在 React-Native 中共享生成的二维码?

标签 reactjs react-native

我使用“react-native-qrcode-svg”生成了QR码,我想通过电子邮件或类似的方式使用react-native的共享模块共享此svg。

import { Share } from 'react-native';
import QRCode from 'react-native-qrcode-svg';
render() {
    return (
        ....
        <QRCode
                color="#090909"
                value={this.props.myCode}
                size={150}
            />
       )
    }
....

 onPress = {()=>{
        Share.share({
             message: 'How I will send QR code image?'                          
             title: 'QR code',
        });
....

我想我需要获取 svg 文件句柄并将其设置到共享模块,但想查看示例代码。

最佳答案

解决方案。终于知道如何分享二维码了。

import QRCode from 'react-native-qrcode-svg';
 <QRCode
          value={JSON.stringify({test: 'testdata'})}
          getRef={c => (this.svg = c)}
        />
        <TouchableOpacity onPress={this.saveQRCode}>
          <View style={styles.instructions}>
            <Text>Share QR code</Text>
          </View>
        </TouchableOpacity>


saveQRCode = () => {
    this.svg.toDataURL(this.callback);
  };



callback(dataURL) {
    console.log(dataURL);
    let shareImageBase64 = {
      title: 'React Native',
      url: `data:image/png;base64,${dataURL}`,
      subject: 'Share Link', //  for email
    };
    Share.open(shareImageBase64).catch(error => console.log(error));
  }

关于reactjs - 如何在 React-Native 中共享生成的二维码?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51269475/

相关文章:

javascript - 接下来用 Express 进行 js 动态 API 调用

javascript - REACT - 单击 Resume 标题不会下载简历 pdf 文件

react-native - 每 x 秒更新一次状态

css - 水平文本旁边的垂直文本 react 原生?

javascript - 错误: bundling failed: TypeError: Cannot read property 'transformFile' of undefined, react native

javascript - JSX 将其绑定(bind)到映射中的函数

javascript - Enzyme 在浅层渲染的 React 组件上为 prop 返回 null

reactjs - 为什么在 IE 11 中,Selenium WebDriver 的 SendKeys 上没有触发 React 的 onChange 事件?

javascript - UI 未更新 React 和 Redux

c# - 使用 Asp.net Core Web Api 响应 Native