(节点:10196)未处理的承诺拒绝警告:类型错误:无法读取未定义的属性“文件名”

时间:2021-02-17 18:23:19

标签: javascript node.js next.js

我正在尝试使用 Nextjs 上传图片,但出现这样的错误。使用Postman时没有问题。 文件名不断返回 undefined 。 我尝试了很多解决方案,但没有得到任何结果。 我认为输入名称部分有问题

  const imgChange = (e) => {
    try {
      let imag = document.getElementById("images");
      imag.src = URL.createObjectURL(e.target.files[0]);
    } catch (err) {
      alert(err);
    }
    setImg(e.target.files[0].name);
  };


  const postData = async (e) => {
    e.preventDefault();
    let data = {
      title: title,
      description: desc,
      image: imgs,
    };
    console.log(data);
    try {
      await axios
        .post("http://localhost:8000/post", data)
        .then((res) => console.log(` res = ${res.data}`));
    } catch (error) {
      alert(error);
    }
  };
  var post = [];
  posts.posts.posts.forEach((item) => {
    post.push(item);
  });
  return (
    <div className={styles.container}>
      <form encType="multipart/form-data" method="POST">
        <div className={styles.imageField}>
          {imgs == null ? (
            <div>
              <label htmlFor="image-file" className={styles.imageLabel}>
                <div className={styles.plusdiv}>
                  <span className={styles.plusIcon}>+</span>
                </div>
              </label>
            </div>
          ) : null}

          <img src=""id="images" className={imgs == null ? "" : styles.imgShow} />   
          <input
            onChange={imgChange}
            type="file"
            name="image"
            hidden
          />
        </div>
        <div className={styles.btnDiv}>
          <button type="submit" className={styles.btnSubmit} onClick={postData}>
            Submit
          </button>
        </div>
      </form>

0 个答案:

没有答案