I would like to access this.props.apiendpoint in api.js which imported in test.js which is component base class.
# api.js
import axios from 'axios';
export function fetchData(){
return axios.post(apiendpoint);
}
# App.js
import test from test.js
export default class App extends Component {
constructor() {
this.apiendpoint = 'api.example.com';
}
render() {
<test apiendpoint = {apiendpoint} />
}
}
# test.js
import PropTypes from 'prop-types';
import {fetchData} from api.js;
const test = ({
}) => {
console.log(this.props.apiendpoint); // this value how to acccess in api.js
fetchData();
}
test.propTypes = {
apiendpoint: PropTypes.String,
}
test..defaultProps = {
apiendpoint : null,
}
like fetchData() I have many functions for API related passing apiendpoint for each function not good practice.
any help will be appreciated.
I would add apiEndPoint as an argument to fetchData function.
# api.js
import axios from 'axios';
export function fetchData(apiendpoint){
return axios.post(apiendpoint);
}
And then call it from test.js by passing prop as a parameter.
import PropTypes from 'prop-types';
import {fetchData} from api.js;
const test = ({
}) => {
console.log(fetchData(this.props.apiendpoint));
}