دسترسی به state کامپوننت فرزند

- 4 ماه پیش
توسط علی بیات آپدیت شد
Hossein Sharifinia ( 510 تجربه )
4 ماه پیش

سلام و خسته نباشید میخواستم بدونم چطور میتونم به state که در کامپوننت فرزد ست شده هست در کامپوننت پدر دسترسی پیدا کنم تا با api ارسال کنم برای مثال id یک اینپوت رو میخوام ارسال کنم.

یک سوال دیگه :
من یک تابع را در یک کامپوننت تعریف میکنم و زمانی که میخوام برای مثال به عنوان onClick در کامپوننت فرزند بر روی یک المان فراخوانی کنم به صورت
nChange={this.handleChanges.bind(this)}
ارور میده که bind یا this شناخته نشد
ممنون میشم راهنمایی کنید.

بهترین پاسخ انتخاب شده توسط Hossein Sharifinia
علی بیات
4 ماه پیش

@hosein.sharifinia

اگر با اونت‌ها در ویو‌ جی اس آشنا باشید(emit & on) ٬ میدونید که کار کردن باهاش خیلی سادست.
یه پکیج هست که همون عملکرد رو برای React پیاده‌سازی میکنه:
https://www.npmjs.com/package/react-emit

مستندات خوبی هم داره. یه نمونه از کدهاش شبیه زیره:

class MyCoolComponent extends React.Component {
  componentDidMount() {
    this.props.on("SomeButton:clicked", data => {
      // Our message is available here!
      // Normally you will create this `on` in a different component.
      alert(data.message);
    });
  }

  handleClick() {
    const data = { message: "Some data you wish to pass." };
    this.props.emit("SomeButton:clicked", data);
  }

  render() {
    return <button onClick={() => this.handleClick()}>Click to Emit</button>;
  }
}

export default withEmit(MyCoolComponent);
علی بیات ( 90017 تجربه )
4 ماه پیش

@hosein.sharifinia

میتونی از اِونت‌ها استفاده کنی. اما راه درست ترش استفاده از یه State Manager مثل Redux هست

Hossein Sharifinia ( 510 تجربه )
4 ماه پیش

@ali.bayat
عزیز از Event میشه یک مثالی بزنید؟!

علی بیات ( 90017 تجربه )
4 ماه پیش

@hosein.sharifinia

اگر با اونت‌ها در ویو‌ جی اس آشنا باشید(emit & on) ٬ میدونید که کار کردن باهاش خیلی سادست.
یه پکیج هست که همون عملکرد رو برای React پیاده‌سازی میکنه:
https://www.npmjs.com/package/react-emit

مستندات خوبی هم داره. یه نمونه از کدهاش شبیه زیره:

class MyCoolComponent extends React.Component {
  componentDidMount() {
    this.props.on("SomeButton:clicked", data => {
      // Our message is available here!
      // Normally you will create this `on` in a different component.
      alert(data.message);
    });
  }

  handleClick() {
    const data = { message: "Some data you wish to pass." };
    this.props.emit("SomeButton:clicked", data);
  }

  render() {
    return <button onClick={() => this.handleClick()}>Click to Emit</button>;
  }
}

export default withEmit(MyCoolComponent);
برای ارسال پاسخ باید وارد سایت شوید