How to reload current page in ReactJS? in case of javascript we can write window.location.reload();
How to do the same in Reactjs? I’m able to add new data by UI. But without refreshing, I’m not able to see the list. I want it so that whenever I’m adding some data, it refreshes by itself.
JavaScript
x
22
22
1
onAddBucket() {
2
let self = this;
3
let getToken = localStorage.getItem('myToken');
4
var apiBaseUrl = "...";
5
let input = {
6
"name" : this.state.fields["bucket_name"]
7
}
8
axios.defaults.headers.common['Authorization'] = getToken;
9
axios.post(apiBaseUrl+'...',input)
10
.then(function (response) {
11
12
if(response.data.status == 200){
13
let result = self.state.buckets.concat(response.data.buckets)
14
}else{
15
alert(response.data.message);
16
}
17
})
18
.catch(function (error) {
19
console.log(error);
20
});
21
}
22
Advertisement
Answer
Since React eventually boils down to plain old JavaScript, you can really place it anywhere! For instance, you could place it in a `componentDidMount()’ function in a React class.
For your edit, you may want to try something like this:
JavaScript
1
42
42
1
class Component extends React.Component {
2
constructor(props) {
3
super(props);
4
this.onAddBucket = this.onAddBucket.bind(this);
5
}
6
componentWillMount() {
7
this.setState({
8
buckets: {},
9
})
10
}
11
componentDidMount() {
12
this.onAddBucket();
13
}
14
onAddBucket() {
15
let self = this;
16
let getToken = localStorage.getItem('myToken');
17
var apiBaseUrl = "...";
18
let input = {
19
"name" : this.state.fields["bucket_name"]
20
}
21
axios.defaults.headers.common['Authorization'] = getToken;
22
axios.post(apiBaseUrl+'...',input)
23
.then(function (response) {
24
if (response.data.status == 200) {
25
this.setState({
26
buckets: this.state.buckets.concat(response.data.buckets),
27
});
28
} else {
29
alert(response.data.message);
30
}
31
})
32
.catch(function (error) {
33
console.log(error);
34
});
35
}
36
render() {
37
return (
38
{this.state.bucket}
39
);
40
}
41
}
42