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; اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
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 اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
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' /> كيف أمرر له القيمة بحيث عندما يتغير رابط الحصة وعند الضغط على الزر يتغير الكي أر كود؟ اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
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> ); } اقتباس رابط هذا التعليق شارك على الشبكات الإجتماعية More sharing options...
السؤال
Mohamed Lamin Mahmoudi
عندما أريد أن أستعمل المكون Qrcode تظهر هذه الاخطاء
رابط هذا التعليق
شارك على الشبكات الإجتماعية
3 أجوبة على هذا السؤال
Recommended Posts
انضم إلى النقاش
يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.