Home > Software design >  i want to make temp value and store array and display it in screen in react js
i want to make temp value and store array and display it in screen in react js

Time:01-04

code

function getPostData(Player, IP, Port, channelName) {
    //console.log("insideFunction Row1" Player); 
    var data = {
      PlayerName: Player,
      ChannelName: channelName,
      Port: Port,
      IpAddress: IP
    }
    axios({
      method: 'post',
      url: 'http://localhost:9763/api/getPlayerStatus',
      data,
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
      },
      auth: {
        username: 'admin',
        password: 'password'
      }
    }).then(response => {
      //var pushValue;    
      tempObj = [response.data];
      // console.log("tempObj", tempObj);
      for ( var i = 0; i <= tempObj.length; i  ) {
        //console.log("forLoop", tempObj[i]);
        temp.push(tempObj[i]);
      }
       console.log("temp", temp);
      Postdata(temp);

    }).catch(error => {
      console.log("Error In Post Data", error);
    });
  }

Console Imge

I want to remove undefined for FORLOOP and want to display 1 temp value in console so that i can easily map the value in table row Please help me Provide some help/Code
I don't know why 4 time temp data appear

i just want display this type of arrayofObject no repeat no undefined value display this temp

I have this type of data { "Status": 1000, "Properties": { "ClipName": "Clip1", "Upcounter": "15:33:44:33", "DownCounter": "16:33:44:33", "ChannelName": "Channel1", "StartTimeCode": "00:00:00:00", "PlayerName": "Vtr1", "Duration": "12:00:00:01" } } { "Status": 1000, "Properties": { "ClipName": "Clip3", "Upcounter": "12:33:44:33", "DownCounter": "12:33:44:33", "ChannelName": "Channel3", "StartTimeCode": "00:00:00:00", "PlayerName": "Vtr3", "Duration": "12:00:00:01" } }

CodePudding user response:

I am not sure but try this

 for (var i = 0; i <= tempObj.length; i  ) {        
    if (tempObj[i] !== undefined) {
        temp.push(tempObj[i]);
    }
}

Another way is that you can use map() method see this example

    const aar1=[
        {status:'sts1',properties:'prop1'},
        undefined,
        {status:'sts2',properties:'prop2'},
        undefined,
        {status:'sts3',properties:'prop3'},
        undefined,
        {status:'sts4',properties:'prop4'},
        undefined,
        {status:'sts5',properties:'prop5'},
    ]

    const aar2= aar1.filter(function(item) {
        return item !== undefined;        
   });

console.log('new array', aar2)

CodePudding user response:

It seems data returned by api might contain invalid things. try below(just replace loop section):

for ( let i = 0; i < tempObj.length; i  ) {
        //console.log("forLoop", tempObj[i]);
        if(tempObj[i] != undefined) temp.push(tempObj[i]);
      }

CodePudding user response:

i think this would help you if I got you right

function getPostData(Player, IP, Port, channelName) {
    const data = {
      PlayerName: Player,
      ChannelName: channelName,
      Port: Port,
      IpAddress: IP
    }
    axios({
      method: 'post',
      url: 'http://localhost:9763/api/getPlayerStatus',
      data,
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
      },
      auth: {
        username: 'admin',
        password: 'password'
      }
    }).then(response => {   
        response.data.map(item => {
            if(item.Properties){
              temp.push(item);
            }
        })
      Postdata(temp);

    }).catch(error => {
      console.log("Error In Post Data", error);
    });
  }
  •  Tags:  
  • Related