Javascript 如何在鼠标离开时提交滑块值，而不是在鼠标离开之前提交所有值

我有一个输入域和滑块，它的范围从1到100. 因为我有切换switch 和下拉按钮，所以我 for each 字段保留onChange事件，而不是提交按钮，包括滑块.

但我面临着一个问题，如果我试图改变滑块从1到50所有的值提交使用onChange，我试图使用onSlideEnd，但它显示旧值(例如:显示1当从1 Select 50时显示50，并显示50从50 Select 时).

我想要的是从1到50只有50个应该从handleSubmit发送到后端

我试过这个代码，但不起作用，请帮帮我

import React, { useEffect, useState } from 'react';
import { Slider } from "primereact/slider";
import { InputText } from "primereact/inputtext";
//some imports

const Config = () => {

  const [factorvalue, setFactorValue] = useState(1);
  const [isSliderDragging, setIsSliderDragging] = useState(false);

  useEffect(() => {
    fetchConfig();
  }, []);
  
  const fetchConfig = async () => {
    try {
      // this is used to get config value from backend to set in front
      const response = await Service.getMaliciousFactorConfig();
      if (response) {
        const maliciousFactorValue = response[0].maliciousFactor || 1;
        setFactorValue(maliciousFactorValue);
      }
    } catch (error) {
      console.log(error.message);
    }
  };

  const handleSliderChange = (event) => {
    try{
      const newValue = parseInt(event.value, 10);
      setFactorValue(newValue);
      handleSubmit(newValue);
    }catch(error){
      console.log(error);
    }
  };

  const handleSliderDragEnd = (event) => {
    setIsSliderDragging(false);
  };

  const handleInputChange = (event) => {
    const newValue = parseInt(event.target.value, 10);
    if (!isNaN(newValue)) {
      setFactorValue(newValue);
      handleSubmit(newValue);
    } else {
      setFactorValue("");
    }
  };

    const handleSubmit = async(value) => {
      try{
         if (value >= 1 && value <= 100) {
            setValidationError("");
            await ConfigService.setConfig(value);
         }
      }catch(error){
         console.log(error);
      }
    };

  return (
          {//demo code}
          <div className="displayFlex">
            <label htmlFor="factor">Factor:</label>
             <div>
               <InputText id="factor" value={factorvalue} onChange={handleInputChange} className="w-full" />
               <Slider value={factorvalue} onChange={handleSliderChange} onSlideEnd={handleSliderDragEnd} className="w-full" min={1} max={100} />
             </div>
          </div>
          {//some code}
  );
};

export default Config;