0

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>

ADyson
  • 57,178
  • 14
  • 51
  • 63
Eniso
  • 29
  • 4
  • 1
    Take a look a json_encode and json_decode functions of both PHP and JS. :) – Wimanicesir Jan 03 '23 at 10:58
  • Does this answer your question? [How do I pass variables and data from PHP to JavaScript?](https://stackoverflow.com/questions/23740548/how-do-i-pass-variables-and-data-from-php-to-javascript) – IsThisJavascript Jan 03 '23 at 11:04
  • 1
    Encode the data in a recognised, universal format such as JSON – ADyson Jan 03 '23 at 11:55
  • @ADyson ok, i undestand, i encode echo json_encode($response); – Eniso Jan 03 '23 at 12:10
  • @ADyson take in php this: [{"images":"projects\/0mxlk1duzt\/\u041d\u0435\u0434\u0432\u0438\u0436\u0438\u043c\u043e\u0441\u0442\u044c \u2014 \u043a\u043e\u043f\u0438\u044f (2).png"},{"images":"projects\/0mxlk1duzt\/modern-house (1).png"},{"images":"projects\/0mxlk1duzt\/1614571218_11-p-goro.png"}] – Eniso Jan 03 '23 at 12:10
  • @ADyson but i don't undestand how to work with it in react – Eniso Jan 03 '23 at 12:11
  • 1
    If you echo that from PHP, then `data` in the JS (in the axios .then((data)...` callback, I mean) should be an array you can loop through. If it's still text, use `JSON.parse` to turn it into an array. – ADyson Jan 03 '23 at 12:28

1 Answers1

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>
))}
fatihyildizhan
  • 8,614
  • 7
  • 64
  • 88
Eniso
  • 29
  • 4