Question

如果我可以在控制台中看到数据，为什么我在“ this.state.viciados”上映射时在屏幕上看不到数据？我已经在堆栈溢出中看到了此问题，但该问题的唯一答案不起作用。

class App extends Component {
  constructor(props) {
super(props);
this.state = {
  viciados: []
}

}


componentDidMount() {
this.getViciados();
}

 getViciados = _ => {
fetch("http://localhost:3000/dependentes")
  .then(response => response.json())
  .then(response => {
    this.setState({ viciados: response.data })
    //console.log(response.data);
  })
  .catch(err => console.log(err));
}



render() {


 const viciados = this.state.viciados.map(viciado => {
  console.log(viciado['id_viciados'], viciado["nome_viciado"]);
  <div key={viciado['id_viciados']}>{viciado["nome_viciado"]}</div>
});
return (
  <div className="App">
    {viciados}
  </div>
);
}
}

export default App;

Answer 1

您需要// generate number from 0 to max (max could include in the result) function getRandom(max) { return Math.floor(Math.random() * (max + 1)); }; // our array to be filled with unordered numbers let indexes = []; // we will fill the above array with 0, 1 ,2 ,3 I mean 0 to (length - 1) let length = 4; // loop through indexes so that it is filled with 4 elements while( indexes.length <= length){ // get a number randomally from 0 to 3 let result = getRandom(length - 1); // we don't want any repeated number so.. if(!indexes.includes(result)){ // finally here is our condition, we should if( result !== indexes[indexes.length - 1] + 1 ){ indexes.push(result); } else if(indexes.length == length){ // push the last element to the array despite the condition indexes.push(result); } } }; console.log(indexes);中的return数据：

map

数据显示在控制台中而不显示在屏幕上-reactjs

1 个答案: