Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- App:
- const App = (props) => {
- return (
- <BrowserRouter>
- <div className='app-wrapper'>
- <Header/>
- <div className='app-wrapper-content'>
- <Route path='/accounts' component={Accounts}/>
- <Route path={'/account:id'} component={Account}/>
- <Route path='/new' component={AccountForm}/>
- </div>
- </div>
- </BrowserRouter>
- );
- };
- Account:
- class Account extends Component {
- constructor(props) {
- super(props);
- this.state = {
- id: this.props.match.params.id,
- name: '',
- email: '',
- password: '',
- link: ''
- }
- }
- componentDidMount() {
- console.log(this.state.id)
- // eslint-disable-next-line
- if (this.state.id === -1) {
- return
- }
- ApiService.fetchAccountById(this.state.id)
- .then(response => this.setState({
- item: {
- name: response.data.name,
- email: response.data.email,
- password: response.data.password,
- link: response.data.link
- }
- }))
- }
- render() {
- let acc = this.state.item;
- return (
- <div>
- <h3>Account</h3>
- <div>{acc.id}</div>
- <div>{acc.name}</div>
- <div>{acc.email}</div>
- <div>{acc.password}</div>
- <div>{acc.link}</div>
- </div>
- )
- }
- ApiService:
- const ACCOUNT_API_BASE_URL = 'http://localhost:8080/api/accounts';
- class ApiService {
- fetchAccounts() {
- return axios.get(ACCOUNT_API_BASE_URL);
- }
- fetchAccountById(id) {
- return axios.get(`${ACCOUNT_API_BASE_URL}/${id}`);
- }
- addAccount(acc) {
- return axios.post(ACCOUNT_API_BASE_URL + '/create', acc);
- }
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement