Javascript 如何在ReactJS中重新加载当前页面？

如何在ReactJS中重新加载当前页面？对于javascript，我们可以编写

window.location.reload（）
如何在reactjs中执行相同的操作？我能够通过UI添加新数据。但是如果没有刷新，我就看不到列表。每当我添加一些数据的时候，我都需要时间本身

onAddBucket() {
    let self = this;
    let getToken = localStorage.getItem('myToken');
    var apiBaseUrl = "...";
    let input = {
      "name" :  this.state.fields["bucket_name"]
    }
    axios.defaults.headers.common['Authorization'] = getToken;
    axios.post(apiBaseUrl+'...',input)
    .then(function (response) {

      if(response.data.status == 200){
      let result =  self.state.buckets.concat(response.data.buckets)
      }else{
        alert(response.data.message);
      }
    })
    .catch(function (error) {
      console.log(error);
    });
  }

使用这个可能会有所帮助

window.location.reload();

由于React最终归结为普通的老JavaScript，所以您可以将它放在任何地方！例如，您可以将其放置在React类中的
componentDidMount（）
上

要进行编辑，您可能需要尝试以下操作：

class Component extends React.Component {
  constructor(props) {
    super(props);
    this.onAddBucket = this.onAddBucket.bind(this);
  }
  componentWillMount() {
    this.setState({
      buckets: {},
    })
  }
  componentDidMount() {
    this.onAddBucket();
  }
  onAddBucket() {
    let self = this;
    let getToken = localStorage.getItem('myToken');
    var apiBaseUrl = "...";
    let input = {
      "name" :  this.state.fields["bucket_name"]
    }
    axios.defaults.headers.common['Authorization'] = getToken;
    axios.post(apiBaseUrl+'...',input)
    .then(function (response) {
      if (response.data.status == 200) {
        this.setState({
          buckets: this.state.buckets.concat(response.data.buckets),
        });
      } else {
        alert(response.data.message);
      }
    })
    .catch(function (error) {
      console.log(error);
    });
  }
  render() {
    return (
      {this.state.bucket}
    );
  }
}

您可以使用
window.location.reload（）componentDidMount（）
lifecycle方法中。如果您使用的是
react路由器
，则它必须执行此操作

编辑：如果您想在数据更新后执行此操作，您可能希望使用
重新渲染
而不是
重新加载
，您可以使用。下面是一个基本的示例，在获取数据后触发
重新渲染

import React from 'react'

const ROOT_URL = 'https://jsonplaceholder.typicode.com';
const url = `${ROOT_URL}/users`;

class MyComponent extends React.Component {
    state = {
        users: null
    }
    componentDidMount() {
        fetch(url)
            .then(response => response.json())
            .then(users => this.setState({users: users}));
    }
    render() {
        const {users} = this.state;
        if (users) {
            return (
                <ul>
                    {users.map(user => <li>{user.name}</li>)}
                </ul>
            )
        } else {
            return (<h1>Loading ...</h1>)
        }
    }
}

export default MyComponent;

从“React”导入React
const ROOT_URL='1〕https://jsonplaceholder.typicode.com';
const url=`${ROOT_url}/users`；
类MyComponent扩展了React.Component{
状态={
用户：空
}
componentDidMount（）{
获取（url）
.then（response=>response.json（））
.then（users=>this.setState（{users:users}））；
}
render（）{
const{users}=this.state；
如果（用户）{
返回(

{users.map（user=>
{user.name}
）}

)
}否则{
返回（加载…）
}
}
}
导出默认MyComponent；
这是我的代码。这对我有用

componentDidMount(){
        axios.get('http://localhost:5000/supplier').then(
            response => {
                console.log(response)
                this.setState({suppliers:response.data.data})
            }
        )
        .catch(error => {
            console.log(error)
        })
        
    }

componentDidUpdate(){
        this.componentDidMount();
}

window.location.reload（）；我认为这件事对你不好

请参阅前一篇文章的答案。您好@RiyaKapuria，所以您可能想做的是调用获取数据所需的api，然后在加载数据后，使用回调函数执行页面刷新。此外，上面的Tiago提出了一个非常明确的观点。您可能只是在寻找重新渲染，在这种情况下，React处理得非常好。我想要数据的串联对不起，我不完全确定您的意思。请再详细说明一下，你看了我回答中的例子了吗？我认为它很好地解决了你的问题。您必须使用
this.seState（）
方法。当您已经在您想要的位置上时，此方法有效。。。注意您当前的路径位置很重要。这会重新加载页面，但不会加载样式！如果这意味着什么的话，我正在使用一个单页应用程序。你说在数据更新后重新渲染可能比重新加载更可取。如果服务器数据已更改，则重新加载将确保您显示的是当前服务器数据，而不是仅更新前端的重新渲染，并且可能不会显示与服务器相同的数据。还是我误解了什么？（我想这取决于您对服务器数据在不重新加载的情况下会如您所期望的那样有多大的信心）。如果数据在服务器中发生了更改，并且您希望显示它，前端应该有一种方法来获取该数据，如WebSocket或轮询，并在获取新数据时触发重新渲染。您说“。并在获取此新数据时触发重新呈现。“重新加载不是基本上获取数据然后重新呈现吗？重新呈现不会触发页面重新加载。它们是不同的概念。重新加载刷新整个页面，再次获取所有数据。重新渲染仅更新必要的内容。我想触发重新渲染，但
this.setState（）
表示
此
未定义，因为我需要在回调内部触发此重新渲染。有什么想法吗？