menghentikantag dalam metode ReactDOM.render () bekerja normal

Saya mendapatkan kesalahan yang sama dalam mode ketat antd v4.0.4

Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of Wave which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://fb.me/react-strict-mode-find-node

Apakah ada solusi tentang hal yang sama atau saran juga akan dihargai.

Menghapus mode ketat hanya demi sebuah tombol itu konyol. Ini adalah masalah yang sah dengan antd yang perlu diperbaiki.

Saya mendapatkan kesalahan yang sama

Perlu melakukan banyak migrasi, seperti # 9870

Hal yang sama di sini setelah instalasi baru menggunakan panduan https://ant.design/docs/react/use-in-typescript

Saya memiliki masalah yang sama

desc

Peringatan: findDOMNode tidak digunakan lagi di StrictMode. findDOMNode diberikan turunan Wave yang ada di dalam StrictMode. Sebagai gantinya, tambahkan referensi langsung ke elemen yang ingin Anda rujuk. Pelajari lebih lanjut tentang menggunakan referensi dengan aman di sini: https://fb.me/react-strict-mode-find-node

memecahkan

ReactDOM.render(
  // <React.StrictMode>
    <App />
  // </React.StrictMode>,
  ,
  document.getElementById('root')
);

Saya memiliki masalah yang sama. Bisakah Anda memperbaikinya?

Saya memiliki masalah yang sama. Bisakah Anda memperbaikinya?

Saya memiliki masalah yang sama, tetapi saya menggunakan komponen lain, jadi masalahnya bukan hanya <Button /> .

Saya memiliki masalah yang sama. saya menggunakan

<InputMask
    mask='99/99/9999'
    onFocus={onFocus} onBlur={onBlur}
    defaultValue={fields.birthdate.value}
    error={fields.birthdate.error}
    helperText={fields.birthdate.helperText}
    id='birthdate' name='birthdate' label='Birthdate MM/DD/YYYY'
    type='tel' variant='filled' margin='dense'
>
    {(inputProps) =>
        <TextField {...inputProps} />
    }
</InputMask>

Garis yang dimaksud sepertinya adalah garis.

menonaktifkan mode ketat sebenarnya bukan pilihan. Bagaimana kita bisa memperbaikinya?

menonaktifkan mode ketat sebenarnya bukan pilihan. Bagaimana kita bisa memperbaikinya?

Berkontribusi pada kode migrasi tentang ini.

Saya mengalami masalah ini di SubMenu dan Pilih komponen juga.

Peringatan: API konteks lama telah terdeteksi dalam pohon mode ketat.
API lama akan didukung di semua rilis 16.x, tetapi aplikasi yang menggunakannya harus bermigrasi ke versi baru.
Harap perbarui komponen berikut: SubMenu

Saya mendapat peringatan yang sama

Masalah yang sama

Masalah yang sama juga :(

Satu lagi di sini, bekerja dengan penyandang cacat, tapi sangat berharap ini bukan solusi jangka panjang.

Masalah yang sama

Masalah yang sama di sini.

Masalah yang sama di sini, apakah tim Ant sudah punya solusinya?

Menu juga menghasilkan peringatan ini:
<Menu mode="horizontal" >
Jika saya menghapus mode horizontal peringatan menghilang. Tapi itu bukan solusi.

Saya kira itu bisa menjadi hal yang besar untuk refactor ini. Mungkin diperlukan untuk menggali banyak komponen.

Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of DOMWrap which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://fb.me/react-strict-mode-find-node
    in ul (created by DOMWrap)
    in DOMWrap (created by SubPopupMenu)
    in SubPopupMenu (created by Connect(SubPopupMenu))
    in Connect(SubPopupMenu) (created by Menu)
    in Provider (created by Menu)
    in Menu (created by Context.Consumer)
    in InternalMenu (created by Context.Consumer)

"antd": "^4.1.5"
"react": "^16.13.1"

Masalah yang sama, tolong !!! silahkan.

Halo @latobibor. Kami sangat menyukai proposal / umpan balik Anda, selamat datang untuk mengirimkan Permintaan Tarik untuk itu. Silakan kirim Permintaan Tarik Anda ke cabang yang tepat (cabang fitur untuk fitur baru, master untuk perbaikan bug dan perubahan lainnya), isi Permintaan Tarik Template disini, sediakan changelog / TypeScript / dokumentasi / test case jika diperlukan dan pastikan CI lolos, kami akan segera memeriksanya, kami hargai sebelumnya dan kami menantikan kontribusi Anda!

Halo @latobibor, kami sepenuhnya setuju dengan saran / umpan balik Anda, silakan di gudang ini untuk membuat Permintaan Tarik untuk menyelesaikan masalah ini. Silakan kirim Permintaan Tarik ke cabang yang benar (fitur baru ke cabang fitur, yang lainnya ke cabang master), pastikan untuk mengisi templat prasetel di Permintaan Tarik, dan berikan log perubahan yang sesuai, definisi TypeScript, kasus uji, dokumen, dll. Yang diperlukan untuk perubahan , Dan pastikan CI lolos, kami akan meninjau secepatnya, terima kasih sebelumnya dan nantikan kontribusi Anda!

Masalah yang sama

index.js:1 Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of Wave which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://fb.me/react-strict-mode-find-node
    in button (created by Context.Consumer)
    in Wave (created by Context.Consumer)
    in Button (at SignInPage/index.js:93)
    in div (created by FormItemInput)
    in div (created by FormItemInput)
    in div (created by Context.Consumer)
    in Col (created by FormItemInput)
    in FormItemInput (created by FormItem)
    in div (created by Context.Consumer)
    in Row (created by FormItem)
    in FormItem (at SignInPage/index.js:92)
    in form (created by ForwardRef(Form))
    in ForwardRef(Form) (created by ForwardRef(InternalForm))
    in SizeContextProvider (created by ForwardRef(InternalForm))
    in ForwardRef(InternalForm) (at SignInPage/index.js:43)
    in div (at SignInPage/index.js:42)
    in div (at SignInPage/index.js:33)
    in div (created by Context.Consumer)
    in Col (at SignInPage/index.js:32)
    in div (created by Context.Consumer)
    in Row (at SignInPage/index.js:31)
    in SignInPage (at AuthLayout/index.js:14)
    in Route (at AuthLayout/index.js:10)
    in Switch (at AuthLayout/index.js:7)
    in AuthLayout (at publicRoute.js:11)
    in Route (at publicRoute.js:9)
    in PublicRoute (at App.js:17)
    in Switch (at App.js:16)
    in Suspense (at App.js:15)
    in Router (created by BrowserRouter)
    in BrowserRouter (at App.js:14)
    in div (at App.js:13)
    in App (at src/index.js:9)
    in StrictMode (at src/index.js:8)

Masalah yang sama, saya baru saja mengikuti dokumen use-in-typescript , dengan demo sederhana seperti ini:

const App = () => (
  <div className="App">
    <Button type="primary">Button</Button>
  </div>
);

Tapi mendapat kesalahan index.js:1 Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of Wave which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here di konsol.

Bagaimana cara memperbaiki?

Saya pikir kita harus mematikan React.StrictMode dan menunggu sampai tim desain semut memperbaiki masalah ini dan memperbarui paket.

masalah yang sama di sini, dan

Satu lagi di sini, bekerja dengan penyandang cacat, tapi sangat berharap ini bukan solusi jangka panjang.

persis

masalah yang sama di versi terbaru (antd 4.2.0)

Masalah yang sama
index.js:1 Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of Wave which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://fb.me/react-strict-mode-find-node

+1

Masalah yang Sama Di Sini
.
Perbaikan akan luar biasa! Terima kasih tim antd!

masalah yang sama

jadi ada solusi?

Tambah satu

Masalah yang sama.

Mengalami masalah ini juga, harap perbaiki!

Juga melihat masalah ini dengan Button.

Tolong perbaiki

Menghadapi masalah yang sama di sini

Saya mengalami masalah yang sama. Apakah seseorang sedang menangani masalah ini?

Apakah Anda yakin itu ada hubungannya dengan antd? Saya beralih ke antd 3. dan masih memiliki masalah yang sama

Ya, karena saya menggunakan komponen.

sama disini. Sepertinya masalah yang cukup mendesak. Ant D dimana ya?

Apakah saat ini ada orang yang mengerjakan PR? Saya mungkin mulai menulis satu

@caelinsutch Sejauh yang saya tahu, tidak ada.

Masalah utama ada di file wave.tsx karena penggunaan findDOMNode. Ada beberapa artikel migrasi, seperti yang ini atau yang ini

Masalah diselesaikan dengan menggunakan:

Terinspirasi oleh contoh resmi: https://ant.design/components/form-cn/

Saya tidak berpikir ujian Anda menyelesaikan kasus saya: https://github.com/ant-design/ant-design/issues/22493#issuecomment -619562638. Dan juga tidak diketahui apa yang Anda lakukan sama sekali. Jika Anda melakukan sesuatu.

@CathyXian Membungkus semua tombol dalam formulir tidak menyelesaikan masalah karena sebagian besar waktu <Button> komponen tidak digunakan dalam formulir tetapi malah memiliki peristiwa onClick terkait dengannya.

Seperti yang ditunjukkan @caelinsutch , komponen Wave menggunakan metode findDOMNode yang tidak digunakan lagi.

Dengan cepat memeriksa komponen mana yang menggunakan metode itu, saya menemukan:

• Tombol https://github.com/ant-design/ant-design/blob/dff19af744cce8920f8038f3d32a3051cae7ef50/components/button/button.tsx#L265 -L269
  Jika Anda menggunakan (type = "link") itu tidak akan menggunakan komponen Wave, itulah yang disebut @CathyXian .

• Beralih https://github.com/ant-design/ant-design/blob/dabec4c8331c6171aaac08ad8b347c6ae754f032/components/switch/index.tsx#L65

• Tag https://github.com/ant-design/ant-design/blob/e1299bfcc97a97078c51f33ae939d815e4eacf7f/components/tag/index.tsx#L114 -L127

Komponen gelombang harus difaktorisasi ulang untuk menghapus metode lama.
Dan, mungkin komponen lain juga harus menyingkirkan metode itu: https://github.com/ant-design/ant-design/search?q=findDOMNode&unscoped_q=findDOMNode

untuk beberapa jenis alasan aneh itu tidak mereproduksi dengan yang berikut:

  <React.Suspense fallback={''}>
    <App />
  </React.Suspense>

untuk beberapa jenis alasan aneh itu tidak mereproduksi dengan yang berikut:

  <React.Suspense fallback={''}>
    <App />
  </React.Suspense>

Saya mencoba ini dan bekerja dengan sangat baik, tetapi pertanyaannya adalah, apakah ini solusi jangka panjang?

untuk beberapa jenis alasan aneh itu tidak mereproduksi dengan yang berikut:

  <React.Suspense fallback={''}>
    <App />
  </React.Suspense>

Ini tidak ada bedanya dengan hanya mengeluarkan <React.StrictMode> terbungkus sekitar <App> . Yang seharusnya tidak perlu.

Juga terjadi dengan anggota Tab

Sama disini,
bisakah Anda memberikan prioritas yang lebih tinggi?

masalah yang sama 😓

Saya memiliki masalah yang sama di sini, adakah yang menemukan solusinya?

Saya memiliki masalah yang sama di sini, adakah yang menemukan solusinya?

Maksud saya ada solusi seperti yang diuraikan di atas, refactoring kode, saya mungkin akan membahasnya akhir minggu ini

Terima kasih! Saya juga mengalami masalah yang sama!

masalah yang sama

permasalahan yang sama

                  `<Button
                        htmlType="button"
                        icon={<LoginOutlined />}
                        onClick={this.onLogin.bind(this)}
                    >
                        Welcome Back
                    </Button>`

Saya menggunakan atribut htmlType yang masih mengalami masalah ini. Penghapusan StrictMode bukanlah solusi. @antd tolong berikan solusinya.

masalah yang sama

Solusi apa pun, masalah yang sama ....

masalah yang sama saat menggunakan SubMenu.
"react": "^ 16.13.1",
"react-dom": "^ 16.13.1",
"antd": "^ 4.3.1",

Masalah yang sama saya menggunakan tombol di form.item

Mengapa Anda tidak melakukan penyelidikan menyeluruh tentang masalah ini? @fachrizal

Masalah yang sama, Ada solusi?

Masalah yang sama dengan submenu di Menu vertikal,

Masalah yang sama di sini. Ini keluar dari komponen Button , tapi saya pikir sebenarnya ada di komponen Wave , di componentDidMount dan onTransitionStart . Bisakah kita menggunakan referensi alih-alih menelepon findDOMNode(this) ?

saya juga

+1

+1

+1

Saya berharap pengembang mengikuti konvensi dan menghindari memberi +1 untuk mengganggu semua orang yang berlangganan utas ini melalui email. Itu sangat menjengkelkan dan tidak profesional, @kreuzhofer @Lemii @moderndegree @TechieQian @lefterisk dan lainnya

Masalah yang sama di sini saat menggunakan Ant Design Menu

masalah yang sama di sini. perlu diperbaiki secepatnya

Masalah yang sama di sini saat menggunakan Tombol Desain Semut

+1

Masalah yang sama di sini.

Masalah yang sama di sini, sangat menyukai solusi atau solusi yang tidak memerlukan mematikan mode ketat.

Saya menghadapi masalah yang sama

Masalah yang sama di sini

masalah yang sama dengan submenu

Tim @Ant , saya sarankan membiarkan ini tetap terbuka tetapi mengunci dan mematikan masalah. +1 tambahan ini dan saya juga sama sekali tidak bernilai untuk membantu menyelesaikan masalah. Anda malah membuat kebisingan dan spam untuk mereka yang mencari pembaruan nyata. Jika Anda ingin membantu, berkontribusi dan potong tinjauan kode.

Terima kasih atas semua yang Anda lakukan! :)

Saya baru saja menginstal antd di proyek React TypeScript saya dan segera setelah saya menggunakan tombol kesalahan itu terlempar. Sedih mengetahui tidak ada solusi untuk ini: l

Sama di sini untuk tombol ant.design.
"antd": "^ 4.6.3",
"react": "^ 16.13.1",
"react-dom": "^ 16.13.1",

Ada pembaruan? Atau solusi?

masalah yang sama

Kesalahan dilaporkan pada baris pertama kode. . . Belum diperbaiki. .

Saya baru saja menemukan masalah ini saat menggunakan Tombol dalam proyek saya.
Saya di "antd": "^ 4.6.2"

masalah yang sama di sini menggunakan Modal.
Saya mendapatkan 2 peringatan:
`index.js: 1 Peringatan: Menggunakan UNSAFE_componentWillReceiveProps dalam mode ketat tidak disarankan dan mungkin menunjukkan bug dalam kode Anda. Lihat https://fb.me/react-unsafe-component-lifecycles untuk detailnya.

• Pindahkan kode pengambilan data atau efek samping ke componentDidUpdate.
• Jika Anda memperbarui status setiap kali props berubah, lakukan refactor kode Anda untuk menggunakan teknik memoization atau pindahkan ke getDerivedStateFromProps.` statis

sebaik :
index.js:1 Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of AnimateChild which is inside StrictMode. Instead, add a ref directly to the element you want to reference.

ada pembaruan?

Masalah yang sama.

Ini perlu diperbaiki.

Terbitkan di sini juga di 4.6.6 saat menggunakan tombol

Pemeriksaan mode ketat dijalankan hanya dalam mode pengembangan; mereka tidak memengaruhi produksi. Jadi pesannya bisa mengganggu ...
Tentu, mengomentarinya bukanlah jawaban yang bagus, tetapi jika tidak berhasil, Anda menawarkan perbaikan?

Masalah yang sama dengan semut 4.6.6 dan bereaksi 16.13.1 :(

Teman-teman, hanya saran jika kesalahan ini mengganggu Anda:

const isDev = process.env.NODE_ENV === 'development'

ReactDOM.render(
  isDev ? <App /> : (
    <React.StrictMode>
      <App />
    </React.StrictMode>
  ),
  document.getElementById('root')
)

Bersulang!

@tokopedia
Ini pada dasarnya sama dengan menghapus StrictMode, karena hanya melakukan validasi di lingkungan pengembangan. Jadi, Anda baru saja menonaktifkan semua pemeriksaan untuk kode Anda sendiri, untuk itulah StrictMode dibuat.

masalah yang sama.

Masalah yang sama.

Masalah yang sama

@ enoh-barbu Saya rasa tidak ada orang yang secara aktif mencoba memperbaikinya.

Meskipun saya benci melihat kesalahan ketika saya membuka konsol, menghapus mode ketat demi kesalahan ini konyol untuk sedikitnya.

Naik

Bagaimana jika kita tidak punya solusi?

sebelum)

setelah)

masalah yang sama sampai sekarang.

masalah yang sama sampai sekarang.

masalah yang sama sampai sekarang

masalah yang sama masih.

Masih rusak

Bagaimana jika kita tidak punya solusi?

sebelum)
(gambar besar)

setelah)
(gambar besar)

Bahkan lebih baik: jika Anda menutup konsol, setiap peringatan akan hilang 😄

Lelucon: menghadapi masalah ini juga pada banyak komponen

masih masalah yang sama
membantu menyingkirkan React.StrictMode

Pertanyaan kepada siapa pun yang mengikuti utas ... apa artinya ini (kesalahan khusus), dan apakah ada yang melihat kode untuk melihat apa yang mungkin menyebabkannya (atau mengapa itu penting). Sejujurnya saya akan mencoba memperbaikinya, tetapi saya tidak punya waktu (atau pengetahuan tentang basis kode) untuk menyelidiki dan melihat mengapa hal itu terjadi atau di mana dalam basis kode kesalahan itu ada.

sunting: jelas saya harus menambahkan bahwa saya juga mengalami kesalahan (meskipun saya tidak memilikinya beberapa hari yang lalu, jadi saya bertanya-tanya apa keadaan spesifik yang memicu kesalahan, yaitu, di situasi mana metode findDOMNode yang tidak digunakan lagi memanggil Button?)

Mungkin kami harus mulai memperlakukan utas ini sebagai upaya kolaboratif dan mencantumkan situasi di mana kami mengalami peringatan dan mulai memecahkan masalah daripada hanya menyatakan "ya, ada kesalahan, perbaiki."

@bayu_joo
Saya bukan ahli dalam hal apa pun tentang basis kode, tetapi cukup sering menggunakannya untuk mengalami masalah, tidak hanya pada elemen tombol. Menghabiskan sedikit waktu untuk menyelidiki, dan mengetahui bahwa penggunaan utama findDomNode terjadi pada komponen gelombang. Apa itu gelombang? Dari apa saya dapat mengumpulkan alat untuk menganimasikan sesuatu, seperti komponen tombol antara lain.

• Jika Anda penasaran, pelaku muncul di sini: https://github.com/ant-design/ant-design/search?q=findDomNode
• dan dapat dilihat aksinya di sini: https://github.com/ant-design/ant-design/blob/820aa04a96d6b1ced9697bb9293a293dfb676364/components/button/button.tsx#L295

Selain menonaktifkan mode ketat (yang saya gunakan sampai perbaikan yang lebih tepat tersedia, atau saya punya waktu untuk mempelajari lebih lanjut tentang wave untuk mengusulkannya sendiri ...), dari tampilan kode, mungkin lebih mudah untuk menambahkan PR menggunakan alat peraga untuk menonaktifkan penggunaan gelombang, daripada sepenuhnya menggantikan penggunaan findDomNode untuk saat ini. Sedikit googling akan mengungkapkan itu bukan hanya masalah desain semut (yaitu: https://stackoverflow.com/questions/61220424/material-ui-drawer-finddomnode-is-deprecated-in-strictmode), jadi saya akan berasumsi bukan perbaikan termudah untuk diterapkan, atau seseorang pasti sudah melompatinya. Karena perubahan apa pun tidak hanya memengaruhi tombol, kami mungkin harus menunggu hingga pembuat desain semut memiliki waktu untuk memprioritaskan hal ini lebih lanjut sehingga mereka dapat menguji solusi yang tepat secara menyeluruh .... Saya tentu menghargai semua pekerjaan mereka yang telah mereka lakukan. dapatkan di sini, jadi saya yakin apa pun solusinya akan menjadi sesuatu yang bekerja sebaik yang lain!

edit:
Bagi siapa pun yang ingin tahu mengapa ini mungkin bukan "perbaikan mudah", berikut adalah beberapa solusi yang disarankan untuk membuang findDomNode. https://medium.com/trabe/getting-rid-of-finddomnode-method-in-your-react-application-a0d7093b2660
dengan asumsi bahwa hal itu memengaruhi banyak komponen, ini memang akan menjadi tugas yang lebih besar daripada siapa pun yang memiliki waktu "bebas" untuk ...

Lacak https://github.com/ant-design/ant-design/issues/26136

Masalah yang sama

Tiket ini telah dibuka selama lebih dari 7 bulan.

Sama

27755 ada permintaan tarik untuk memperbaiki masalah ini

+1

Saya tidak tahu tentang aturan dalam proyek ini, tetapi di komunitas lain mengirim spam pada komentar "sama" dan "+1" tidak disarankan karena

• jika ada masalah yang mendesak, biasanya pengembang sangat menyadarinya,
• itu tidak menambahkan sesuatu yang substansial untuk menyelesaikan masalah,
• pengembang membutuhkan waktu untuk memeriksa pemberitahuan mereka,
• itu mengambil waktu dari pengamat lain, yang juga memiliki banyak spam dalam pemberitahuan mereka.

Mungkin kami dapat dengan mudah menyatakan dukungan untuk masalah ini dengan menggunakan: +1: di masalah teratas.

Diperbaiki di https://github.com/ant-design/ant-design/pull/27755

Terima kasih telah mengerjakan perbaikannya, saya suka perpustakaannya. Sayangnya saya masih melihat peringatan ini dengan [email protected].
Hanya muncul setelah async-validator diaktifkan saat menggunakan Input di dalam Formulir.

Saya mendapat masalah yang sama dengan [email protected]