--- title: Higher-Order Components localeTitle: مكونات الترتيب الأعلى --- ## مكونات الترتيب الأعلى في React ، يكون **مكون ترتيب** مرتفع (HOC) دالة تأخذ مكونًا وتعيد مكونًا جديدًا. يستخدم المبرمجون HOCs لتحقيق **إعادة استخدام المنطق المكون** . إذا كنت قد استخدمت `connect` Redux ، فقد عملت بالفعل مع مكونات الطلب العليا. الفكرة الأساسية هي: `const EnhancedComponent = enhance(WrappedComponent); ` أين: * `enhance` هو مكون ترتيب العليا؛ * `WrappedComponent` هو المكون الذي تريد `WrappedComponent` ؛ و * `EnhancedComponent` هو المكون الجديد الذي تم إنشاؤه. هذا يمكن أن يكون الجسم من `enhance` HOC: `function enhance(WrappedComponent) { return class extends React.Component { render() { const extraProp = 'This is an injected prop!'; return (