Cannot scan a QRcode with letters includes "ÅÄÖ" generated by react-qr-code

537 Views Asked by At

Im trying to add a page that creates Qrcode by using react-qr-code.

Everything works normal until I include these following letters "ÅÄÖ" in value.
Does anyone has any clue why i cannot use "ÅÄÖ" in value?

I refer to this page codesandbox. but this page works even i have "ÅÄÖ" in value. so i dont really understand why it does work with my code. its pretty exactly the same....

Here is my component

import React from 'react';
import { connect } from 'react-redux';
import { createQRcode } from '../../actions/labelActions';
import QRCode from "react-qr-code";


class OrderCeateQRcode extends React.Component {

    componentDidMount() {
        const labelID = this.props.match.params.id;
        this.props.createQRcode(labelID);
    };

    render() {
        let labeldetail = this.props.labeldetail || [];

        const Aritcle = labeldetail[0] ? labeldetail[0].name : 'ERROE!';
        const Content = Aritcle + ':innehåller smör';

        return (
            <div className = "row">
                <div className="col-sm">
                    <QRCode
                        value={ Content }
                        renderas="svg"
                        style={{
                        width: "70vmin",
                        height: "70vmin"
                        }}
                    />
                </div>
            </div>            
        );
    }
}


const mapStateToProps = (state) => {
    return {
        labeldetail:state.order.labeldetails,
    };
};
  
  
const mapDispatchToProps = dispatch => {
    return({
        createQRcode: (labelID) => dispatch(createQRcode(labelID)),  
    })
}


export default connect(mapStateToProps,mapDispatchToProps)(OrderCeateQRcode);

0

There are 0 best solutions below