كيفية استدعاء دالة بمجرد وضع الفأرة على مكون react

Rayden Storm · 31 مارس 2021

لدي مكون شبيه بهذا

import React from 'react'

export default function test() {

const changeColor = (color) => {...}

    return (
        <div>
            <Post></Post>
        </div>
    )
}

وأريد عند وضع الفأرة على المكون Post أن أستدعي الدالة changeColor

Abdullah Muhammad · 31 مارس 2021

يمكنك إستخدام الحدث (Event) onMouseOver كالتالي

function Test() {
  const changeColor = (color) => {....};

  return (
    <div>
      <p onMouseOver={changeColor}>Hello</p>
    </div>
  );
}

ولكن هذا في حالة كنت تستخدم عنصر HTML عادي أما في حالة إستخدام مكون ريأكت ماعليك إلا إن تجعلها ضمن ال props الخاصه بهذا المكون ومن ثم إستخدامها داخل المكون على سبيل المثال كالتالي

function Test() {

  const changeColor = (color) => {...}
  
      return (
          <div>
              <Post onMouseOver={changeColor}></Post>
          </div>
      )
  }
  
  const Post = (props) => { 
    return (
      <p onMouseOver={props.onMouseOver}>Content</p>
      )
  }

كيفية استدعاء دالة بمجرد وضع الفأرة على مكون react

السؤال

Rayden Storm

رابط هذا التعليق

شارك على الشبكات الإجتماعية

1 جواب على هذا السؤال

Recommended Posts

Abdullah Muhammad

رابط هذا التعليق

شارك على الشبكات الإجتماعية

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

إعلانات

تابعنا على

الرئيسية

تابعنا

دروس ومقالات

أسئلة وأجوبة

كتب

دورات

بطاقات هدية