第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

當(dāng)值被刪除時(shí),react styled-componens 輸入值變?yōu)?Non

當(dāng)值被刪除時(shí),react styled-componens 輸入值變?yōu)?Non

人到中年有點(diǎn)甜 2023-12-25 16:57:10
我有一個(gè) RangeSlider 和另一個(gè)輸入綁定到它,問(wèn)題是當(dāng)有人從滑塊下的輸入中清空(刪除)值時(shí),滑塊變?yōu)榘咨⑶抑底優(yōu)榉?,如所附屏幕截圖所示你可以查看演示有什么幫助嗎?
查看完整描述

3 回答

?
ITMISS

TA貢獻(xiàn)1871條經(jīng)驗(yàn) 獲得超8個(gè)贊

演示:https ://codesandbox.io/s/optimistic-khayyam-3g8sv?file=/src/Slider.js

 

  ? !isNaN(value) ? value : 'no value'

   : value >= 1000

 ? `$${(value / 1000).toFixed(2)}k`

 : `$${value}`

}


查看完整回答
反對(duì) 回復(fù) 2023-12-25
?
蝴蝶刀刀

TA貢獻(xiàn)1801條經(jīng)驗(yàn) 獲得超8個(gè)贊

你有這條線

inputs[i].data = parseInt(e.target.value);

– 如果該值不可解析為整數(shù),則您會(huì)得到NaN.

您必須決定在這種情況下該怎么做;一個(gè)簡(jiǎn)單的解決方案是利用 s 為假的事實(shí)來(lái)替換零NaN

inputs[i].data = parseInt(e.target.value) || 0;


查看完整回答
反對(duì) 回復(fù) 2023-12-25
?
子衿沉夜

TA貢獻(xiàn)1828條經(jīng)驗(yàn) 獲得超3個(gè)贊

我認(rèn)為問(wèn)題出在你的 onChange 函數(shù)上!你不加區(qū)別地使用 parseInt,如果給定一個(gè)非數(shù)字值,parseInt 可以返回 NaN!另外,你的 onChange 有點(diǎn)奇怪,當(dāng)它運(yùn)行時(shí)(在任何輸入更改上),它會(huì)在每次輸入發(fā)生更改時(shí)檢查每個(gè)輸入。除非您希望它們有某種聯(lián)系,否則這是不必要的。您可以在 onChange 中為它們提供索引,以便在您的狀態(tài)中訪問(wèn)它們,然后在 onChange 函數(shù)中使用它。就像這樣。


const onChange = (event, index) => {

...etc

inputs[index].data = parseInt(e.target.value);

// fix your NaN problem around here

...etc


}

渲染你的組件:


{data.map((item, i) => {

      const bgcolor = RangeSliderColors(item.name);

      return (

      <div

        key={i}

        style={{

          display: "flex",

          flexDirection: "column",

          marginTop: "100px"

        }}

      >

      <RangeSlider

        name={item.name}

        value={item.data}

        width={20}

        min={0}

        minValue={10}

        step={item.data > item.min ? 1 : item.min}

        max={100}

        bgcolor={bgcolor}

        onChange={() => onChange(i)} // This will let you know which one is changed.

      />

    </div>

  );

})}


查看完整回答
反對(duì) 回復(fù) 2023-12-25
  • 3 回答
  • 0 關(guān)注
  • 237 瀏覽

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)