V
V
vlad2vlad2021-11-25 20:31:45
JavaScript
vlad2vlad, 2021-11-25 20:31:45

Why is onChange not working on a text field on iOS?

There was a problem when working with inputs on iOS.
Here is my component code:

import './Input.css'
import {
    Component
} from 'react'
export default class Input extends Component {
    constructor(props) {
        super(props);
        this.state = {
            value: this.props.content,
            initiate: this.props.content,
            errored: false
        }
        this.handleChange = this.handleChange.bind(this)
    }
    handleChange(event) {
        this.setState({
            value: event.target.value
        }, () => {
            if (this.props.callback) {
                this.props.callback(this)
            }
        })
    }
    render() {
        if (this.props.content !== this.state.initiate) {
            this.setState({
                value: this.props.content,
                initiate: this.props.content
            })
        }

        return ( <
            > {
                this.props.label ? < label htmlFor = {
                    this.props.type
                } > {
                    this.props.label
                } : < /label> : null} <
                    input onBlur = {
                        this.props.onBlur
                    }
                onFocus = {
                    this.props.onFocus
                }
                type = {
                    this.props.type === 'password' ? 'password' : 'text'
                }
                className = {
                    'Input' + (this.state.errored ? ' Input_errored' : '')
                }
                id = {
                    this.props.type
                }
                placeholder = {
                    this.props.placeholder
                }
                data - name = {
                    this.props.type
                }
                value = {
                    this.state.value || ''
                }
                disabled = {
                    this.props.disabled
                }
                onChange = {
                    this.handleChange
                }
                /> <
                />
            )
        }
    }


Everything works fine until I open the compiled iOS web app. Simply no text is entered when pressing the keys. I looked at the console, it does not show an error. Apparently the problem is in onChange. Where is the mistake?

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question