Передача значения из input в button React

21 января 2021, 13:50

Есть поле, в котором прописан статический путь формирования файла. Я сделал это поле редактируемым на случай, если пользователь захочет по своему желанию изменить путь для формирования.

        <div className="w3-col l8 m8 s8">
          <input
            className="w3-input"
            type="text"
            name="file_name"
            defaultValue={`${test_path}`}
            disabled={false}
          />
        </div>

Так же есть кнопка, при клике которой вызывается функция формирования файла по заданному пути

<Btn_enabled
              func={() =>
                create_file(
                  `${test_path}.xmind`,
                )
              }
              name="Сформировать файл"
            />

Как можно передать измененный путь пользователем в кнопку?

Answer 1

import React, { useState, useCallback } from 'react';
const Example = () => {
  const { path, setPath } = useState('');
  const handleChangePath = useCallback((e) => {
    setPath(e.target.value);
  }, []);
  const handleClick = useCallback(() => {
    create_file(`${path}.xmind`);
  }, [path]);
  return (
    <>
      <input value={value} onChange{handleChangeValue} />
      <button onClick={handleClick}>Create Flie</button>
    </>
  );
}

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Проверка отправки формы Wordpress/Divi

Есть сайт на Wordpress (на конструкторе Divi), при отправке формы надо выводить попап "спасибо за обращение"У формы есть встроенный валидатор, к коду...

123

javascript

Передача значения из input в button React

Проверка отправки формы Wordpress/Divi

Обнуление переменной setInterval

Использование данных из формы?

Как работает динамический import?