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

ما هي بالضبط طريقة getInitialProps في NextJS؟

عبد النور محمد

السؤال

اعمل مع NextJS ورأيت مثالاً لصفحة

class IndexPage extends Component {
  static async getInitialProps(context) {
    return {};
  }
  render() {
    return <div>hello world</div>;
  }
}
export default withRouter(IndexPage);

ما هي بالضبط طريقة getInitialProps في NextJS؟

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

Recommended Posts

  • 0

عادة ما تكون getInitialProps دالة غير متزامنة وهي جيدة للعمليات غير المتزامنة على الخادم ثم تقوم بتمرير البيانات إلى الصفحة على شكل Props. يمكن تشغيله على الخادم والمتصفح إذا كنت تستخدم Link على سبيل المثال. بشكل عام يمكنك استخدام getInitialProps لجلب البيانات عندما يعمل المكون الخاص بك كصفحة ، وتريد تقديم البيانات Props, إذا كنت تستخدم Next.js 9.3 أو أحدث ، يوصى باستخدام getStaticProps أو getServerSideProps بدلا من getInitialProps.

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

  • 0

كما شرح محمد في التعليق السابق فهي تستخدم للقيام بجلب بعض البيانات في الخادم وهناك مهام نستخدمها في المتصفح 

وهذه بعض الخصائص الخاص بال getInitialProps 

  • تستَخدَم لجَلْب بعض البيانات بشكل غير متزامن ، ويتم توليدها من خلال ال props

  • سيتم تنفيذ الدالة getInitialProps  على الخادم فقط.من تحميل الموقع المبدئي

  • يمكنك استخدامها في المتصفح من خلال ال routing

  • لا يمكننا استخدامها في ال children components 

ويفضل استخدام getStaticProps أو getServerSideProps بدلا من getInitialProps. بداية من  Next.js 9.3 

ويمكنك قراءة المزيد من المعلومات حول getStaticProps و getServerSideProps من خلال هذا السؤال

 

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

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

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

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

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   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.

  • إعلانات

  • تابعنا على



×
×
  • أضف...