Redux: Bagaimana dengan referensi?

Dibuat pada 27 Jun 2015  ·  8Komentar  ·  Sumber: reduxjs/redux

Jika saya menggunakan <Connector> sekitar beberapa komponen yang memiliki atribut ref , saya tidak dapat lagi mengaksesnya melalui this.refs . Saya baru saja merefaktor sedikit untuk memperbaikinya - saya kira ini adalah jenis komponen cerdas versus bodoh yang sia-sia. Atau apakah saya melewatkan sesuatu yang sederhana?

help wanted question

Komentar yang paling membantu

Maaf, tapi saya tidak melihat bagaimana mendorong penggunaan 'findDOMNode' dalam kasus sepele seperti itu bahkan dapat dianggap sebagai solusi. Ini adalah anti pola! Ini mengembalikan kita ke hari-hari jquery di mana kita perlu mengakses semua elemen dan tahu persis hierarki node. Dokumen Anda berhak membaca:

'findDOMNode () adalah pintu keluar masuk ... penggunaan pintu keluar ini tidak dianjurkan karena menembus abstraksi komponen'

Semua 8 komentar

komponen pintar versus bodoh

Saya rasa ya, komponen _smart_ Anda dengan Connector seharusnya hanya membuat komponen _dumb_ dan meneruskan props kepada mereka.

@cymen Anda dapat menggunakan panggilan balik ref untuk ini :)

const decorator = (Base) => {
  return class {
    render() {
      return <Base {...this.props} />
    }
  }
}

<strong i="7">@decorator</strong>
class Test {

  render () {
    return <div ref={this.props.refCallback}>my div</div>;
  }

}


class Wrapper {

  componentWillMount() {
    this.nestedRef = null;
  }

  componentDidMount() {
    console.log(React.findDOMNode(this.nestedRef));
  }

  setNestedRef = (ref) => {
    this.nestedRef = ref;
  }

  render() {
    return <Test refCallback={this.setNestedRef} />
  }
}

Di atas akan mencatat div. Mungkin ini membantu?

Ini menggunakan dekorator, tetapi mungkin akan bekerja dengan baik jika Anda meneruskan callback ke komponen yang Anda masukkan ke dalam Connector . Di dalam callback, Anda dapat menetapkan ref kembali ke komponen Anda.

Apakah Anda benar-benar membutuhkan ref bersarang?

Jika Anda hanya ingin mengakses simpul DOM, Anda dapat melakukan findDOMNode pada komponen luar dan itu akan bekerja dengan baik. (Mereka akan menunjuk ke node yang sama.)

Jika Anda ingin memanggil metode, pertimbangkan untuk menggunakan props sebagai antarmuka deklaratif. Lihat juga https://github.com/jsstyles/react-jss/issues/15 untuk diskusi tentang ini.

Terakhir, jika Anda _certain_ Anda memerlukan referensi, ya, Anda dapat mengambil ref bersarang seperti @johanneslumpe yang disarankan di https://github.com/gaearon/redux/issues/183#issuecomment -115988937.

Sebagai penutup, beri tahu saya jika ada yang tidak jelas.

Maaf, tapi saya tidak melihat bagaimana mendorong penggunaan 'findDOMNode' dalam kasus sepele seperti itu bahkan dapat dianggap sebagai solusi. Ini adalah anti pola! Ini mengembalikan kita ke hari-hari jquery di mana kita perlu mengakses semua elemen dan tahu persis hierarki node. Dokumen Anda berhak membaca:

'findDOMNode () adalah pintu keluar masuk ... penggunaan pintu keluar ini tidak dianjurkan karena menembus abstraksi komponen'

Maaf, tapi saya tidak melihat bagaimana mendorong penggunaan 'findDOMNode' dalam kasus sepele seperti itu bahkan dapat dianggap sebagai solusi. Ini adalah anti pola! Ini mengembalikan kita ke hari-hari jquery di mana kita perlu mengakses semua elemen dan tahu persis hierarki node.

Saya tidak yakin apa yang Anda maksud. Saya mengatakan bahwa, jika Anda memerlukan referensi ke node yang dirender (misalnya, untuk menghitung offset dan ukurannya), Anda dapat menggunakan findDOMNode(this) . Saya tidak menyarankan Anda untuk "masuk lebih dalam" atau mengubahnya.

Yang mengatakan jika Anda tidak senang dengan ini, cukup gunakan alat peraga panggilan balik ref seperti yang disarankan di atas.

Saya tidak berpikir kita harus bergantung pada findDOMNode(this) karena itu tidak berlaku untuk React-Native.

@xvalentino findDOMNode tidak diperlukan. Lihat bit yang terkait dengan getWrappedInstance di dokumen API .

Apakah halaman ini membantu?
0 / 5 - 0 peringkat