react-native組件(6)--(react-native-qrcode)

字符串生成二維碼組件
安裝

npm install react-native-qrcode --save

使用
'use strict';
import React, { Component } from 'react'
import QRCode from 'react-native-qrcode';

import {
    AppRegistry,
    StyleSheet,
    View,
    TextInput
} from 'react-native';

class HelloWorld extends Component {
  state = {
    text: 'http://facebook.github.io/react-native/',
  };

  render() {
    return (
      <View style={styles.container}>
        <TextInput
          style={styles.input}
          onChangeText={(text) => this.setState({text: text})}
          value={this.state.text}
        />
        <QRCode
          value={this.state.text}
          size={200}
          bgColor='purple'
          fgColor='white'/>
      </View>
    );
  };
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: 'white',
        alignItems: 'center',
        justifyContent: 'center'
    },

    input: {
        height: 40,
        borderColor: 'gray',
        borderWidth: 1,
        margin: 10,
        borderRadius: 5,
        padding: 5,
    }
});

AppRegistry.registerComponent('HelloWorld', () => HelloWorld);

module.exports = HelloWorld;
參數(shù)
prop type default value
value string 我是要變二維碼的字符串
size number 128
bgColor string (CSS color) "#000"
fgColor string (CSS color) "#FFF"
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 簡短說明 收錄一些好用的RN第三方組件,以方便日常的使用,大家有什么推薦的也可以跟我說,我加進(jìn)去。如有冒犯,可以聯(lián)...
    以德扶人閱讀 43,900評(píng)論 44 214
  • Android 自定義View的各種姿勢(shì)1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 178,825評(píng)論 25 709
  • 恢復(fù)作息時(shí)間,正常化! 堅(jiān)持自考學(xué)習(xí),拿文憑! 關(guān)注時(shí)事政治,講政治! 少說,多干,務(wù)實(shí);慎言,慎行;戒驕,戒躁。
    YM一銘閱讀 149評(píng)論 0 0
  • 徐不二閱讀 392評(píng)論 0 2
  • 大石橋可能也算是鄭州的一個(gè)地標(biāo)性地名。也是鄭州變化最大的一個(gè)地方之一。以前的大石橋就是一座普通的石頭橋,位于...
    老馬識(shí)新途閱讀 2,278評(píng)論 0 1

友情鏈接更多精彩內(nèi)容