Чтобы вызвать кнопку загрузки изображения с помощью другой кнопки в ReactJS, вы можете использовать несколько методов. Вот несколько подходов:

1. Ссылки: вы можете создать ссылку для элемента ввода файла и получить к ней программный доступ, чтобы вызвать диалоговое окно выбора файла. Вот пример:

import React, { useRef } from 'react';
function App() {
  const fileInputRef = useRef(null);
  const handleButtonClick = () => {
    fileInputRef.current.click();
  };
  return (
    <div>
      <button onClick={handleButtonClick}>Trigger Image Upload</button>
      <input type="file" style={{ display: 'none' }} ref={fileInputRef} />
    </div>
  );
}

2. Управляемый компонент: вы можете использовать подход с управляемым компонентом, при котором входное значение файла контролируется переменной состояния. Обновив переменную состояния, вы можете вызвать диалоговое окно выбора файла. Вот пример:

import React, { useState } from 'react';
function App() {
  const [selectedFile, setSelectedFile] = useState(null);
  const handleButtonClick = () => {
    document.getElementById('file-input').click();
  };
  const handleFileChange = (event) => {
    const file = event.target.files[0];
    setSelectedFile(file);
    // Perform any additional operations with the selected file
  };
  return (
    <div>
      <button onClick={handleButtonClick}>Trigger Image Upload</button>
      <input
        type="file"
        id="file-input"
        style={{ display: 'none' }}
        onChange={handleFileChange}
      />
    </div>
  );
}

3. Используйте библиотеку. Если вы предпочитаете использовать библиотеку, вы можете рассмотреть возможность использования популярных библиотек загрузки файлов, таких как React-Dropzone или React-FilePond. Эти библиотеки предоставляют простые в использовании компоненты со встроенными функциями для запуска загрузки файлов.