如何讓Ajax調用自動刷新的反應js

Question

我需要使該頁面自動刷新，使ajax調用後端3分鐘，如何設置？我在想的是在ajax中設置一個時間間隔，讓它每3分鐘自動調用一次？有什麼辦法可以實現這個嗎？ 或者有更好的解決方案來實現這個？

export default class InventoryLevelReport extends React.Component { 
    constructor() { 
    super(); 

    this.state = { 
     data: [ 
     { 
      sku: null, 
      inventoryCount: 0 
     } 
     ], 
     url: '/mft/api/reports/inventory-view' 
    }; 
    } 

    sortByCount() { 
    this.setState({data: _.orderBy(this.state.data, (i) => i.inventoryCount)}); 
    } 

    componentDidMount() { 
    ajax(this.state.url, { 
     success: data => { 
     console.log(data); 
     this.setState({data: data.data}); 
     } 
    }); 
    } 

    render() { 
    const buttonStyle = { 
     position: 'relative', 
     float: 'right' 
    }; 
    return <div className="content"> 
     <Button style={buttonStyle} onClick={() => this.sortByCount()}>Sort</Button> 
     <div> 
     <Table tableType='bordered'> 
      <th>SKU</th> 
      <th>Count</th> 
      <tbody> 
      {this.state.data.map((data, i) => <InventoryTableRow data={data} key={i} />)} 
      </tbody> 
     </Table> 
     </div> 
    </div>; 
    } 
} 

class InventoryTableRow extends React.Component { 

    render() { 
    return (
     <TableRow> 
     <TableColumn>{JSON.stringify(this.props.data.sku).split('"').join('')}</TableColumn> 
     <TableColumn>{JSON.stringify(this.props.data.inventoryCount)}</TableColumn> 
     </TableRow> 
    ); 
    } 
} 

Answer 1

你應該能夠setInterval

constructor() { 
    super(); 

    // ... existing constructor code 

    this.loadData = this.loadData.bind(this) 
} 

loadData() { 
    ajax(this.state.url, { 
    success: data => { 
     console.log(data); 
     this.setState({data: data.data}); 
    } 
    } 
} 

componentDidMount() { 
    this.loadData() 
    setInterval(this.loadData), 180000); // 3 minutes in milliseconds 
}