首页 > 解决方案 > React Laravel - 文件显示状态但不在控制器中

问题描述

我的项目有 React 作为前端,Laravel 作为后端。我正在尝试上传文件,文件的详细信息在上传时显示为状态,但不在控制器中,因此无法将其上传到文件夹中。

组件有

<div className="form-group col-sm-4">
   <div className="imgPreview">{$imagePreview}</div>
   <label>Profile Pic</label>
   <input className="form-control" type="file" name="profile_pic" onChange={(e)=>this._handleImageChange(e)}/>
</div>

进一步的代码是:

_handleImageChange(e) {
    e.preventDefault();
    let reader = new FileReader();
    let file = e.target.files[0];    
    reader.onloadend = () => {
      this.setState({
        fileselected:           file,
        profile_pic:            file.name,
        imagePreviewUrl:        reader.result
      });
    }    
    reader.readAsDataURL(file)
  }

数据通过 axios 上传

 submitHandler = e =>{
    e.preventDefault()
    this.props.drprofilecreate(this.state)
}

export const drprofilecreate = (data) => dispatch =>{
console.log("Coming form profile create action ")
console.log(data)
return  axios.post('/api/v1/drProfileCreate', data)
.then( res =>res.data )
    .then(drprofile =>
        dispatch({
            type: DRPROFILECREATE,
            payload: drprofile,
        }),            
    )
}

当我查看正在上传的数据时,它会显示文件及其名称、大小等详细信息。但控制器中没有相同的内容。它显示一个空白数组。

 public function drProfileCreate(Request $request){
    $data = $request->all();
    $response = [
        'success'       =>true, 
        'datax'          =>'Dr Profile uploaded in Contorller. Check',
        'data'          => $data
    ];
    return response()->json($response, 201);
}

因此我无法上传图像。请帮忙。赞赏 在此处输入图像描述

标签: reactjslaravelreduxaxios

解决方案


推荐阅读