Bagaimanakah saya melakukan nilai peluncur apabila tetikus pergi, dan bukannya melakukan semua nilai sebelum tetikus pergi?
P粉129731808
P粉129731808 2023-07-27 15:35:18
0
1
470

Saya mempunyai medan input dan peluncur, julat peluncur adalah dari 1 hingga 100. Memandangkan saya juga mempunyai suis togol dan menu lungsur, saya menggunakan acara onChange untuk setiap medan dan bukannya menggunakan butang serah, termasuk peluncur.

Tetapi saya menghadapi masalah, jika saya cuba menukar peluncur dari 1 kepada 50, semua nilai dari 1 hingga 50 diserahkan dalam acara onChange. Saya cuba menggunakan acara onSlideEnd tetapi ia menunjukkan nilai lama (contohnya: apabila memilih 50 daripada 1, ia menunjukkan 1; apabila memilih 20 daripada 50, ia menunjukkan 50).

Saya mahu pada perubahan daripada 1 kepada 50, hanya 50 akan dihantar ke bahagian belakang dalam handleSubmit.

Saya telah mencuba kod ini tetapi ia tidak berjaya, tolong bantu untuk menyelesaikannya.


import React, { useEffect, useState } daripada 'react'; import { Slider } daripada "primereact/slider"; import { InputText } daripada "primereact/inputtext"; //beberapa import const Config = () => { const [nilai faktor, setFactorValue] = useState(1); const [isSliderDragging, setIsSliderDragging] = useState(false); useEffect(() => { fetchConfig(); }, []); const fetchConfig = async () => { cuba { // ini digunakan untuk mendapatkan nilai konfigurasi dari bahagian belakang ke set di hadapan respons const = menunggu Service.getMaliciousFactorConfig(); jika (tindak balas) { const maliciousFactorValue = respons[0].maliciousFactor || 1; setFactorValue(maliciousFactorValue); } } tangkap (ralat) { console.log(error.message); } }; const handleSliderChange = (acara) => { cuba{ const newValue = parseInt(event.value, 10); setFactorValue(newValue); handleSubmit(newValue); }tangkap(ralat){ console.log(error); } }; const handleSliderDragEnd = (acara) => { setIsSliderDragging(false); }; const handleInputChange = (acara) => { const newValue = parseInt(event.target.value, 10); jika (!isNaN(newValue)) { setFactorValue(newValue); handleSubmit(newValue); } lain { setFactorValue(""); } }; const handleSubmit = async(nilai) => { cuba{ jika (nilai >= 1 && nilai <= 100) { setValidationError(""); tunggu ConfigService.setConfig(value); } }tangkap(ralat){ console.log(error); } }; kembali ( {//kod demo} 
{//beberapa kod} ); }; eksport Konfigurasi lalai;


P粉129731808
P粉129731808

membalas semua (1)
P粉262926195

Debouncing nampaknya penyelesaian yang tepat untuk anda. .Baca lagi

Terdapat cangkuk React disediakan.di sini.

    Muat turun terkini
    Lagi>
    kesan web
    Kod sumber laman web
    Bahan laman web
    Templat hujung hadapan
    Tentang kita Penafian Sitemap
    Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!