اذهب إلى المحتوى
  • 0

كيفية ربط jQuery بال React

Ahmed Yehia2

السؤال

Recommended Posts

  • 0

أجل بالطبع يمكنك ذلك حيث في نهاية المطاف الجي كويري والreact يظلان مجرد مكتبات للجافاسكريبت, فبالتالي يمكنك إستخدامهم سويًا ويكون بالشكل التالي:

خطوات تثبيت الجي كويري في تطبيق React.js

  1. تثبيت الجيكويري عبر مدير الحزم npm عن طريق إستعمال الأمر 
    npm install jquery --save

     

  2. بعدها نقوم بعمل إستيراد للمعامل $ عبر الشفرة التالية 

    import $ from 'jquery';

     

  3. ومن ثم يمكنك إستخدامها كما تفعل في تطبيقات الجافاسكريبت بشكلٍ إعتيادي 

    $("button").click(function(){
        $.get("demo_test.asp", function(data, status){
            alert("Data: " + data + "\nStatus: " + status);
        });
    });

     

ولكن السؤال الحقيقي هل يجب عليك فعل هذا؟

عيوب إستخدام الجي كويري في الreact

مبدأيًا دعنا نتعرف على أحد مبادئ هندسة البرمجيات وهو مبدأ المسؤلية الواحدة (single responsbility) والذي ينص على أن في أي نظام يجب أن يكون كل قطعة في النظام مسؤلة عن أمر واحد فقط , وبالمثل كل أمر يكون مسؤل عنه قطعة واحدة فقط 

ما علاقة هذا بإستخدام الجيكويري؟  

حسنًا في الحقيقة أن الreact تقوم بعمليات معالجة الDOM ولكن عبر الخفاء بشكلٍ لا تراه نسبيًا, فكل ما عليك فعله فقط هو تعريف الstate ومن ثم تقوم الreact بمعالجة الDOM وفقًا لتغير ذلك الstate بشكلٍ تلقائي, بينما الجيكويري تقوم بمعالجة الDOM بشكلٍ يدوي حيث يجب عليك كتابة كل سطر من الشفرة البرمجية لتنفيذ أوامر المعالجة المطلوبة, المشكلة في ذلك أننا الأن أصبح لدينا قطعتين في النظام يقومون بنفس الوظيفة وبالتالي هذا يؤثر على الأداء بالإضافة إلى أنه يؤدي إلى نتائج غير متوقعة في كثيرٍ من الأحيان

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0

نعم يمكنك ذلك  بإتباع الخطوات التالية :

اولاً نفذ الأمر التالي في موجه الأوامر لتحميل المكتبة

npm install jquery --save

ثم يمكنك كتابة كود jquery في أي ملف jsx 

import $ from 'jquery';//هنا نقوم باستيراد هذا الرمز من مكتبة ال jquery


 componentDidMount() {
	$("button").click(function(){
  		// jquery code
	});
}

 

تم التعديل في بواسطة Mohammad Al Eik
رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...