Реакция: невозможно проверить тип поля ввода

Question

Как я могу проверить тип поля ввода в JSX моего компонента реагирования?

Например, предположим, что в состав JSX входит следующее:

<form>
    <input type="number" name="testfield" />
</form>

Теперь я хочу написать контрольный пример, который должен проверять, является ли тип поля ввода числом или нет?

Answer 1

Вы можете использовать селекторы css, чтобы найти элемент в компоненте и подтвердить его существование.

expect(wrapper.find('input[name="testfield"][type="number"]')).toHaveLength(1);

Answer 2

Скажем, у вас есть:

<form > <input type='text' name='name' id='name' onChange={this.handleChange}/> </form>

Вы можете создать функцию в классе, например:

handleChange(event){ console.log(event.target.type) // Use this to compare the type. if ( event.target.type == 'number' ) {// Your case } }

Вы также можетеиспользуйте event.target для сравнения различных свойств, таких как имя (event.target.name) и т. д. Если у вас есть несколько элементов внутри <form>, начните со сравнения имен цели, чтобы вы знали, какой элемент был изменен, так как мы можемиспользовать один и тот же обработчик для каждого элемента.