首页 > 解决方案 > TypeError:event.preventDefault 不是函数

问题描述

我正在关注教程并复制了所有内容,但 TypeError: event.preventDefault is not a function在 onSubmit() 中出现了此错误,但 event.preventDefault 在 onChange() 中有效

这是我的代码:

import React, { Component } from 'react'
import '../App.css';
import ipfs from './ipfs';

class Add extends Component {
  constructor(props) {
    super(props);

    this.state = {
      ipfsHash: '',
      buffer: null,
    };

    this.captureFile = this.captureFile.bind(this);
    this.onSubmit = this.onSubmit(this);
  }

  captureFile(event) {
    event.preventDefault();
    const file = event.target.files[0];
    const reader = new window.FileReader();
    reader.readAsArrayBuffer(file);
    reader.onloadend = () => {
      this.setState({ buffer: Buffer(reader.result) });
      console.log('buffer', this.state.buffer);
    };
  }

  onSubmit(event) {
    event.preventDefault();
    ipfs.files.add(this.state.buffer, (error, result) => {
      if (error) {
        console.error(error);
        return;
      }
      this.setState({ ipfsHash: result[0].hash });
      console.log('ipfsHash', this.state.ipfsHash);
    });
  }

  render() {
    return (
      <div>
        <h1>Add a Graduate</h1>
        <form onSubmit={this.onSubmit}>
          <input type='file' onChange={this.captureFile} />
          <input type='submit' />
        </form>
        <h1>Transcript of Record</h1>
        <img src={'https://ipfs.io/ipfs${this.state.ipfsHash}'} alt=''></img>
      </div>
    );
  }
}

export default Add;

我不明白错误是什么。

标签: javascriptreactjseventspreventdefault

解决方案


在构造函数中,您调用的是 onSubmit 方法而不是绑定this:让我们更改this.onSubmit = this.onSubmit(this); 为:

this.onSubmit = this.onSubmit.bind(this);

推荐阅读