Advertisement
Qpel

3prktk

Nov 14th, 2019
471
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.69 KB | None | 0 0
  1.  
  2. import React, {Component} from 'react';
  3.  
  4.  
  5. class App extends Component {
  6.  
  7. constructor(props){
  8. super(props)
  9. this.onHandleUsers = this.onHandleUsers.bind(this)
  10. this.tekstas = "abc";
  11.  
  12. this.state = {
  13. isLoaded: false,
  14. users: []
  15. }
  16. }
  17.  
  18.  
  19.  
  20.  
  21. handleUserChange = (e) => {
  22. const {value} = e.target
  23. this.onHandleCurrentUsers(value)
  24. this.tekstas = this.onHandleCurrentUsers(value)
  25.  
  26. }
  27.  
  28. onHandleUsers() {
  29. fetch("http://localhost:3000/api/users")
  30. .then(res => res.json())
  31. .then(result => {
  32. this.setState({
  33. isLoaded: true,
  34. users: result
  35. })
  36. })
  37. .catch(e => console.log(e))
  38. }
  39.  
  40. onHandleCurrentUsers(userId) {
  41. const data = {userId: userId}
  42. fetch("http://localhost:3000/api/user", {
  43. method: 'POST',
  44. headers: { "Content-Type": "application/json"},
  45. body: JSON.stringify(data)
  46. })
  47. .then(res => res.json())
  48. .then(result => {
  49. this.setState({
  50. isLoaded: false,
  51. currentUser: result
  52. })
  53. })
  54. .catch(e => console.log(e))
  55. }
  56.  
  57.  
  58.  
  59.  
  60. render() {
  61. const {currentUser} = this.state
  62. return (
  63. <div>
  64.  
  65.  
  66. <button onClick={this.onHandleUsers}>Gauti vartotojus</button>
  67. <ul>
  68. {
  69. this.state.isLoaded && this.state.users.map(item => {
  70. return (
  71. <ol>Vardas: {item.name} <br>
  72. </br>Pavardė: {item.surname}</ol>
  73. )
  74. })
  75. }
  76.  
  77. </ul>
  78. <button onClick ={e => this.onHandleCurrentUsers(1)}>Gauti pirma vartotoja</button>
  79. <button onClick ={e => this.onHandleCurrentUsers(2)}>Gauti antra vartotoja</button>
  80. <div>
  81. {
  82. currentUser && <div>{currentUser.name} {currentUser.surname}</div>
  83. }
  84. </div>
  85.  
  86. <br></br>
  87. {/* antra dalis */}
  88. <div>
  89.  
  90. <input name='userId' onChange={this.handleUserChange} />
  91. {this.tekstas}
  92. </div>
  93.  
  94. <div> </div>
  95. </div>
  96.  
  97. )
  98. }
  99. }
  100.  
  101.  
  102. export default App
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement