How to get array from php to react axios? - php

Question

Array
(
[0] => Array
(
[images] => projects/0mxlk1duzt/1.png
)
[1] => Array
(
[images] => projects/0mxlk1duzt/2.png
)
[2] => Array
(
[images] => projects/0mxlk1duzt/3.png
)
)
this is array what i have in php file on server, code in php
<?php
header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE");
header("Access-Control-Allow-Headers: Content-Disposition, Content-Type, Content-Length, Accept-Encoding");
header("Content-type:application/json");
$response = array();
foreach(glob('projects/0mxlk1duzt/*', GLOB_NOSORT) as $image)
{
array_push($response,array(
"images" => $image
));
}
print_r($response);
?>
next i have react app with axios with code:
class Gallery extends React.Component {
state = {
images: []
}
componentDidMount() {
const url = 'http://work.eniso.ru/gallery.php'
axios.get(url).then(response => response.data)
.then((data) => {
this.setState({ images: data })
console.log(this.state.images)
})
}
render(){
return(
<div className='gallery'>
<ul>
{ this.state.images }
</ul>
</div>
)
}
}
Now i can only output this in text format, but I don't understand how to get array and in react i must do array.map to output elements in <li><li>

Answer 1

In PHP I need to do:
echo json_encode($response);
In React I need to array.map:
{ this.state.images.map((response, i) => (
<div key={i}>
<img className='img-prew' src={response.images} />
</div>
))}