Как я могу иметь поле, которое принимает два разных формата маски?

Я создаю форму и использую компонент маски ввода-вывода. Пользователь может иметь два разных формата номера телефона: (99) 9999-9999 или (99) 9 9999-9999.

Я прочитал документы, но не могу сказать, как сделать следующее поле, чтобы оно принимало эти 2 формата и адаптировалось к типам пользователей. Заранее спасибо!

<InputMask onBlur={(e) => this.handleBlur('telefone', e.target.value)}
           type="text"
           defaultValue={new_item.telefone}                        
           class='inputTextCriar'
           mask="(99) 9999-9999">
</InputMask>


person placementw    schedule 22.07.2020    source источник


Ответы (1)


Как человек, который никогда не использовал этот компонент, я думаю, что самый быстрый способ решить проблему — добавить некоторую логику в свойство маски.

const mask = value.length === 11 ? "(99) 9 9999-9999" : "(99) 9999-9999"
<InputMask
 mask={mask}
 ...
/>
person Eduardo Nishizuka    schedule 22.07.2020
comment
Я понимаю, что вы пытались сделать, но это не сработало, просто не форматировалось вообще. Кроме того, как вы предложили, значение не будет определено, я попытался использовать функцию стрелки и проверить длину target.event.value. Все еще не работает - person placementw; 22.07.2020