javascript - 如何让我的表单使用easybase在reactjs中插入数据？

Question

import { useEasybase } from 'easybase-react';
import { useEffect, useState } from "react";





function NewSked() {
  const { db } = useEasybase();
  const[name, setName] = useState("");
  const[time, setTime] = useState(0);
  const[duration, setDuration] = useState(0);
  const[date, setDate ] = useState("");
  const HandleSubmit = (evt) => {
      evt.preventDefault();
    }
  const HandleNewSked = async() => {
    try {
      const inDate = date;
      const inDuration = duration;
      const inTime = time;
      const inName = name;
      if (!inDate || !inDuration || !inName || !inTime) return;

      await db('CALENDAR').insert({
      name: inName,
      start_time: inTime,
      sked_date: inDate,
      duration: inDuration
    }).one();
    } catch(_) {
      alert("Error on input format");
    }
  }

  return (
    <form onSubmit={HandleNewSked} className="newSkedForm">
      <label>Title:</label>
          <input type="text" value={name} onChange={e => setName(e.target.value)} />
      <label>Time:</label>
          <select name="time" value={time} onChange={e => setTime(e.target.value)}>
            <option value="00:00">12:00 am</option>
            <option value="00:30">12:30 am</option>
          </select>
      <label>Duration:</label>
        <input type="number" value={duration} onChange={e => setDuration(e.target.value)}/>
        <label>Date:</label>
        <input type="date" value={date} onChange={e => setDate(e.target.value)} />
      <button type="submit" className="submitButton" onClick={SubmitNewSked}>✔️</button>
    </form>
    )
}

export default NewSked;

每当我提交表单时，什么都没有发生。我是新来的反应和一般的 js/jsx。我正在为这个项目使用easybase。基本上，我正在尝试将表单中的数据插入数据库。我还有另一个显示当前计划的组件，但它工作正常。

标签： javascriptreactjsjsx