更改输入字段中的默认值React

Question

我想在 React 上创建一个应用程序，用户可以在其中输入他的银行卡号码。输入字段中将有一个包含 16 个零的默认值，接下来的每个零将立即更改为输入的数字。

import React, { useState } from 'react'


function CardNumber() {
  const [value, setValue] = useState('')


  const changeState = event => {
    setValue(event.target.value)
  }


  return (
    <input
    value={value}
    onChange={changeState}
    placeholder='0000 0000 0000 0000'/>
  )

}

export default CardNumber

Answer 1

从 'react' 导入 React, { useState };

function CardNumber() { const [value, setValue] = useState('0000 0000 0000 0000');

常量changeState =事件=> { const inputValue = event.target.value; const Value = inputValue.replace(/\D/g, ''); const formattedValue = Value.replace(/(.{4})/g, '$1 ').trim(); 设置值（格式化值）； };

返回（ ）； }

导出默认卡号；

我刚刚补充说，输入长度不超过16位数字+3个空格（总共19个），并且格式化的值是4个非数字分组。我希望这能帮到你