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

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

反應:用最后兩個輸入數(shù)字設置值

反應:用最后兩個輸入數(shù)字設置值

臨摹微笑 2022-07-21 09:58:46
遇到情況,我不知道如何解決。在此輸入中寫入數(shù)字時,無論我輸入多少個數(shù)字,我都只想看到最后插入的兩個數(shù)字。例子:Input = 5  Value = 5Input = 59 Value = 59Input = 597 Value = 97Input = 5970 Value = 70Input = 59701 Value = 01等等。const [number, setNumber] = useState(0);function handleChange(e) {  setNumber(e.target.value);}return (  <div>    <input type="text" maxLength="2" value={number} onChange={handleChange} />  </div>)
查看完整描述

1 回答

?
喵喔喔

TA貢獻1735條經(jīng)驗 獲得超5個贊

轉(zhuǎn)移到字符串

然后使用slice()剪切最后 2 個數(shù)字

const result = Number(e.target.value.toString().slice(-2));

const App = () => {

  const [number, setNumber] = React.useState(0);

  function handleChange(e) {

    const result = Number(e.target.value.toString().slice(-2));

    setNumber(result);

    console.log(result);

  }

  return (

    <div className="App">

      <input type="text" value={number} onChange={handleChange} />

    </div>

  );

}

ReactDOM.render(<App />, document.getElementById("root"));

<div id="root"></div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.12.0/umd/react.production.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.12.0/umd/react-dom.production.min.js"></script>


或者更復雜的方式如下


使用split(),pop(),join()


const x = e.target.value.toString().split('');

const y = [x.pop(), x.pop()].reverse();

const result = Number(y.join(''));

const App = () => {

  const [number, setNumber] = React.useState(0);

  function handleChange(e) {

    const x = e.target.value.toString().split('');

    const y = [x.pop(), x.pop()].reverse();

    const result = Number(y.join(''));

    setNumber(result);

    console.log(result);

  }

  return (

    <div className="App">

      <input type="text" value={number} onChange={handleChange} />

    </div>

  );

}

ReactDOM.render(<App />, document.getElementById("root"));

<div id="root"></div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.12.0/umd/react.production.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.12.0/umd/react-dom.production.min.js"></script>


一旦你完全控制了綁定到onChangeand的處理函數(shù)value,就不需要maxLength defaultValue相關(guān)的 props。



查看完整回答
反對 回復 2022-07-21
  • 1 回答
  • 0 關(guān)注
  • 112 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學習伙伴

公眾號

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