Добрый вечер,
У меня небольшая проблема с каким-то кодом, который я пишу.Я только начинаю изучать React, поэтому любая помощь будет принята с благодарностью.
Я пытаюсь написать небольшую страницу для загрузки нескольких изображений, в которой есть Reaction-Dropzone и Laravel в качестве бэкэнда.
Когда янажмите кнопку отправки, адрес электронной почты проходит через нормально, но что-то происходит с изображениями.изображения правильно передаются через валидацию laravel, а также через строку if( $request->hasFile('myimages') ) {, но когда он попадает в цикл foreach, он ничего не находит.Я не уверен, что это вещь Laravel или реакция, я предполагаю реакцию, как я использовал этот скрипт php-загрузки.
Мой код реакции выглядит следующим образом:
import React, { Component } from "react";
import Dropzone from 'react-dropzone';
import axios from 'axios';
class SendSomething extends Component {
constructor(props) {
super(props);
this.onDrop = (files) => {
this.setState({files})
};
this.state = {
files: [],
email: ''
};
}
onChangeHandler = e => {
this.setState(
{ email: e.target.value }
)
};
onClickHandler = () => {
const data = new FormData();
data.append('emailaddress', this.state.email);
this.state.files.forEach(file => {
data.append('myimages', file, file.name);
});
axios.post("/api/endpoint", data, {
})
.then(res => {
alert(res.data.message);
this.setState({
email: '',
files: []
});
})
};
render() {
const files = this.state.files.map(file => (
<li key={file.name}>
{file.name} - {file.size} bytes
</li>
));
return (
<div>
<form>
<div className="form-group">
<label htmlFor="exampleInputEmail1">Email</label>
<input type="email" name="email" value={this.state.email} onChange={this.onChangeHandler} className="form-control" id="exampleInputEmail1" placeholder="Enter email" />
</div>
<div>
<Dropzone
onDrop={this.onDrop}
accept="image/png, image/gif, image/jpeg"
minSize={0}
maxSize={5242880}
multiple
>
{({getRootProps, getInputProps}) => (
<section className="container">
<div {...getRootProps({className: 'dropzone'})}>
<input {...getInputProps()} />
<p>Click here or drop a file to upload!</p>
</div>
<aside>
<ul>{files}</ul>
</aside>
</section>
)}
</Dropzone>
</div>
<button type="button" onClick={this.onClickHandler} className="btn btn-primary">Submit</button>
</form>
</div>
);
}
}
export default SendSomething;
имой код Laravel:
public function store(Request $request)
{
request()->validate([
'emailaddress' => 'required',
'myimages' => 'required',
'myimages.*' => 'image|mimes:jpeg,jpg,gif,png'
]);
if( $request->hasFile('myimages') ) {
foreach($request->file('myimages') as $image) {
$imageName = time() . '.' . $image->getClientOriginalExtension();
$image->move(public_path('images'), $imageName);
$data[]['emailaddress'] = $request->input('emailaddress');
$data[]['imagename'] = $imageName;
}
}
$success = ImageUpload::insert($data);
return $this->sendResponse($success, 'Uploaded successfully.');
}
Спасибо за любую помощь заранее.