0

Здравствуйте.

function someFunc (obj, callbackFunc){
    let copyObj = {...obj};

    function handleOnChange(event){
        let target = event.target;
        let changedObj = {
            name: target.value;
        }
        return changedObj;
    }

    function handleSubmit(event){
        callbackFunc(handleOnChange);
        event.preventDefault();
    }

    return(
        <form onSubmit='handleSubmit'>
            <input type='text' value='copyObj.name' onChange='handleOnChangeInput'/>
        </form>
    );
}

Идея такая, по нажатию кнопки из класса в функцию приходит объект и callback-функция, объект копируется и передается в input, в input меняется, объект передается в callback функцию, callback функция передает объект в класс, который выводит объект на страницу. Суть проблемы, value input'а не получает значение объекта; при нажатии на кнопку объект приходит в функцию, проверял с console.log, но при копировании и передачи значений объекта в value ничего не происходит. Как мне кажется, проблема в моем handleOnChange, но не пойму где, помогите, пожалуйста.

2
  • Это, наверное, react? 25 окт 2018 в 16:07
  • @stepanKasyanenko Да, все верно
    – Frylock
    25 окт 2018 в 16:22

1 ответ 1

0

Не уместилось в комментарий, потому пишу здесь.

Синтаксис jsx в реакте это value={copyObj.name} и тоже самое для onSubmit и onChange. Кавычки рендерят просто текст.

И ещё мне не понятна логика вашего кода. Например я изменил имя объекта в инпуте. И отрабатывает handleOnChangeInput() но его нет. Есть handleOnChange(). Но предположим что речь о нем и если речь о нем, то при срабатывании он возвратит объект в пустоту. Все let переменные внутри удалятся. Потом я засабмитил форму. Вызывается handleSubmit() который вызывает колбек в который передает то, что возвратит после выполнения handleOnChange, которому в свою очередь нужен ивент, но он его не получит. Потому как происходит вызов этого метода из кода. Только событие передает ивент по умолчанию. Если вручную вызываете, то надо передать и ивент. И ещё не мешало бы делать проверку введённого значения. Пустые строки там и все такое.

Кроме консоль.лог есть ещё react developer tools для хрома. Полезная вещь.

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.