Mohamed Lamin Mahmoudi نشر 31 مايو 2022 أرسل تقرير نشر 31 مايو 2022 عندما أريد أن أستعمل المكون Qrcode تظهر هذه الاخطاء import React ,{useState, Component} from 'react'; import {View,Text,StyleSheet,ScrollView,KeyboardAvoidingView,TextInput,TouchableOpacity} from 'react-native'; import List from './compononts/list'; import Loader from './compononts/Loader'; import Inbut from './compononts/Inbut'; import { Entypo } from '@expo/vector-icons'; import ScreenTitle from './compononts/ScreenTitle'; import QRCode from "react-qr-code"; function AddRoom(){ const [formData, setFormData]=useState({ NameOfroom:'', NumberOfroom: '', date:'', QrCode:'' }); const changeFormValue=(key,value)=>{ setFormData({...formData,[key]:value}); } const { NameOfroom, NumberOfroom, date,QrCode}=formData; return( <ScrollView contentContainerStyle={{paddingVertical:20}} > <View style={styles.container}> <View style={styles.titlescreen}> <ScreenTitle title="أضف حصة " ></ScreenTitle> <Entypo name="add-to-list" size={70} color="black" style={styles.icontitle} /> </View> </View> <KeyboardAvoidingView behavior='padding' enabled> <View style={styles.styInbut}> <Inbut placeholder="إسم الحصة " value={NameOfroom} onChangeText={(text)=>changeFormValue('NameOfroom',text)} /> <Inbut placeholder="رقم الحصة " value={NumberOfroom} onChangeText={(text)=>changeFormValue('NumberOfroom',text)} /> <Inbut placeholder="تاريخ الحصة " value={date} onChangeText={(text)=>changeFormValue('date',text)} /> <View style={styles.Qrcodestyl}> <TextInput style={styles.TextInputStyle} value={QrCode} onChangeText={(text) => changeFormValue('Qrcode',text)} underlineColorAndroid = "transparent" placeholder="Enter URL to Generate QR Code" /> <TouchableOpacity onPress={QrCode} activeOpacity={0.7} style={styles.button} > <Text style={styles.TextStyle}> Click Here To Generate QR Code </Text> </TouchableOpacity> //هنا الخطأ <QRCode></QRCode> </View> </View> </KeyboardAvoidingView> </ScrollView> ) }; const styles=StyleSheet.create({ container:{ flex:1, justifyContent:'center', alignItems:'center' }, titlescreen:{ position:'relative', top:-40 }, icontitle:{ position:'relative', right:-25, top:-20 }, styInbut:{ position:'relative', left:45, top:-40 }, textcont:{ fontSize:25, position:'relative', left:90, bottom:-5, }, Qrcodestyl:{ position:'relative', left:50 }, TextInputStyle:{ position:'relative', left:-60, width: '80%', height: 50, borderRadius: 10, marginBottom: 10, borderWidth: 1, borderColor: 'blue', textAlign: 'center' }, button: { position:'relative', right:60, height:50, width: '80%', paddingTop:8, paddingBottom:8, backgroundColor: '#009688', borderRadius:7, marginBottom: 20 }, TextStyle:{ color:'#fff', textAlign:'center', fontSize: 18 } }) export default AddRoom; اقتباس
0 عمر قره محمد نشر 31 مايو 2022 أرسل تقرير نشر 31 مايو 2022 يبدو لي ان المشكلة هي انك تقوم بتعريف المتغير QRCode في الموضع : بتاريخ 7 ساعات قال Mohamed Lamin Mahmoudi: const { NameOfroom, NumberOfroom, date,QrCode}=formData بعد ان كان معرف بالفعل من قبل : بتاريخ 7 ساعات قال Mohamed Lamin Mahmoudi: import QRCode from "react-qr-code" كما اظن انك لست بحاجة للسطر const { NameOfroom, NumberOfroom, date,QrCode}=formData; حيث يمكن الوصول لهذه المتغيرات من خلال الـ formData.QRCode formData.NameOfroom formData.NumberOfroom formData.date كما ان العنصر QRcode يحتاج ل value : <QRCode value="hey" /> 1 اقتباس
0 Mohamed Lamin Mahmoudi نشر 31 مايو 2022 الكاتب أرسل تقرير نشر 31 مايو 2022 بتاريخ 47 دقائق مضت قال عمر قره محمد: يبدو لي ان المشكلة هي انك تقوم بتعريف المتغير QRCode في الموضع : بعد ان كان معرف بالفعل من قبل : كما اظن انك لست بحاجة للسطر const { NameOfroom, NumberOfroom, date,QrCode}=formData; حيث يمكن الوصول لهذه المتغيرات من خلال الـ formData.QRCode formData.NameOfroom formData.NumberOfroom formData.date كما ان العنصر QRcode يحتاج ل value : <QRCode value="hey" /> <TouchableOpacity onPress={formData.QRCode} activeOpacity={0.7} style={styles.button} > <Text style={styles.TextStyle}> Click Here To Generate QR Code </Text> </TouchableOpacity> //هنا <QRCode value={this.formData.QRCode} size={250} bgColor='#000' fgColor='#fff' /> كيف أمرر له القيمة بحيث عندما يتغير رابط الحصة وعند الضغط على الزر يتغير الكي أر كود؟ اقتباس
0 عمر قره محمد نشر 1 يونيو 2022 أرسل تقرير نشر 1 يونيو 2022 بتاريخ 10 ساعات قال Mohamed Lamin Mahmoudi: <TouchableOpacity onPress={formData.QRCode} activeOpacity={0.7} style={styles.button} > <Text style={styles.TextStyle}> Click Here To Generate QR Code </Text> </TouchableOpacity> //هنا <QRCode value={this.formData.QRCode} size={250} bgColor='#000' fgColor='#fff' /> كيف أمرر له القيمة بحيث عندما يتغير رابط الحصة وعند الضغط على الزر يتغير الكي أر كود؟ في الكود الخاص بك سيتم تحديث الـ <QRCode value={this.formData.QRCode} size={250} bgColor='#000' fgColor='#fff' /> عند اي تغيير في قيمة الـ this.formData.QRCode إذا كنت لا تريد ان يتم التحديث بشكل تلقائي يجب إضافة متغير جديد وتحديث الـ </ QRcode> فقط عند الضغط على الزر ثم عمل refresh للصفحة : // نضيف العنصر التالي let _QRcode = ""; function AddRoom() { const [formData, setFormData] = useState({ NameOfroom: "", NumberOfroom: "", date: "", QrCode: "", }); const changeFormValue = (key, value) => { setFormData({ ...formData, [key]: value }); }; // نقوم بعمل الوظيفة الخاصة بالتحديث const [refresh, setRefresh] = useState(0); // لا بأس من استخدام هذه الطريقة حيث انها ليست من تسبب المشكلة const { NameOfroom, NumberOfroom, date, QrCode } = formData; return ( <ScrollView contentContainerStyle={{ paddingVertical: 20 }}> <View style={styles.container}> <View style={styles.titlescreen}> <ScreenTitle title='أضف حصة '></ScreenTitle> <Entypo name='add-to-list' size={70} color='black' style={styles.icontitle} /> </View> </View> <KeyboardAvoidingView behavior='padding' enabled> <View style={styles.styInbut}> <Inbut placeholder='إسم الحصة ' value={NameOfroom} onChangeText={(text) => changeFormValue("NameOfroom", text)} /> <Inbut placeholder='رقم الحصة ' value={NumberOfroom} onChangeText={(text) => changeFormValue("NumberOfroom", text)} /> <Inbut placeholder='تاريخ الحصة ' value={date} onChangeText={(text) => changeFormValue("date", text)} /> <View style={styles.Qrcodestyl}> <TextInput style={styles.TextInputStyle} value={QrCode} onChangeText={(text) => changeFormValue("Qrcode", text)} underlineColorAndroid='transparent' placeholder='Enter URL to Generate QR Code' /> <TouchableOpacity // نقوم بتغير قيمت المتغيير الذي عرفناه في الاعلى ثم تحديث الصفحة onPress={() => { _QRcode = QrCode; setRefresh(refresh + 1); }} activeOpacity={0.7} style={styles.button} > <Text style={styles.TextStyle}> Click Here To Generate QR Code </Text> </TouchableOpacity> {/*QRCode نقوم بوضع المتغير الذي عرفناه كقيمة للـ */} <QRCode value={_QRcode} size={250} bgColor='#000' fgColor='#fff' /> </View> </View> </KeyboardAvoidingView> </ScrollView> ); } اقتباس
السؤال
Mohamed Lamin Mahmoudi
عندما أريد أن أستعمل المكون Qrcode تظهر هذه الاخطاء
3 أجوبة على هذا السؤال
Recommended Posts
انضم إلى النقاش
يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.