Блог

То, что я пытаюсь сделать, находится в моем приведенном ниже коде.у меня есть одна таблица, и когда я выбираю строку, а затем нажимаю кнопку «Найти», данные не извлекаются в api .

и я пытаюсь сделать это в своем коде ниже, когда я выбираю строку и нажимаю кнопку, тогда я не получаю данные в консоли

Мне нужно сделать вызов api при нажатии кнопки, как мы можем это сделать

Мне нужно вызвать этот api при нажатии кнопки https://mocki.io/v1/b512f8b8-64ab-46e4-9e0c-9db538a0ad9e

мой код

https://codesandbox.io/s/react-example-forked-o8tu5

Проверьте этот пример. Я изменил ваш код, чтобы вы поняли, как это сделать.

 class Test extends React.Component {
  constructor(props) {
    super();
    this.state = {
      row: ''
    };
  }
  selectList = (selected) => {
    this.setState({row: selected});
  }
  handleSubmit = (e) => {
    e.preventDefault();
    alert(`call APi here: ${this.state.row}`)
  }
  render() {
    return (
      <div>
        <div
          className="table-employee"
          style={{ marginTop: "20px", border: " 1.5px solid darkgray" }}
        >
          <table onClick={() => this.selectList('First')} className="table table-hover table-bordered table-sm">
            <thead>
              <tr>
                <th scope="col">Select</th>
                <th scope="col"> LOAD DATE</th>
                <th scope="col"> FILE DATE</th>
                <th scope="col"> SERVICE</th>
                <th scope="col"> PROVISIONER CODE </th>
                <th scope="col"> DESCRIPTION</th>
              </tr>
            </thead>
            <tbody>
              <tr>
                <td>
                  <input type="radio" preventDefault name="select" />
                </td>

                <td>dfgrty</td>
                <td>fgfg</td>
                <td>fgfg</td>
                <td>erer</td>
                <td>uuio</td>
              </tr>
            </tbody>
          </table>
        </div>
        <div className="btn-submit">
          <button
            onClick={this.handleSubmit}
            className="btn btn-primary"
            style={{ marginRight: "30px" }}
            type="submit"
          >
            submit
          </button>
        </div>
      </div>
    );
  }
}
 

Живая демонстрация