xapu

Untitled

Oct 31st, 2017
162
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import React, { Component } from 'react'
  2. import './App.css'
  3.  
  4. class App extends Component {
  5. constructor () {
  6. super()
  7.  
  8. this.state = {
  9. email: '',
  10. confirmEmail: '',
  11. userName: '',
  12. password: '',
  13. confirmPassword: '',
  14. agreeWithTerms: false,
  15. legitMail: false,
  16. legitName: true,
  17. legitPassword: true
  18. }
  19.  
  20. this.submitReg = () => {
  21. let payload = this.state
  22.  
  23. let data = new FormData()
  24.  
  25. // data.append('json', JSON.stringify(payload))
  26.  
  27. console.log(payload)
  28.  
  29. fetch('http://localhost:5000/auth/signup', {
  30. headers: { 'Content-Type': 'application/json' },
  31. method: 'POST',
  32. body: JSON.stringify(payload)
  33. })
  34. .then(r => {
  35. return r.json()
  36. })
  37. .then(pr => {
  38. console.log(pr)
  39. })
  40. }
  41.  
  42. this.submiLog = () => {}
  43.  
  44. this.promisfyState = newState => {
  45. return new Promise(res => {
  46. this.setState(newState, res)
  47. })
  48. }
  49. }
  50.  
  51. async componentDidUpdate () {
  52. if (this.state.email !== '') {
  53. if (this.state.email === this.state.confirmEmail) {
  54. await this.promisfyState({ legitMail: true })
  55. } else {
  56. await this.promisfyState({ legitMail: false })
  57. }
  58. }
  59. }
  60.  
  61. shouldComponentUpdate (nextProps, nextState) {
  62. if (this.state.email === nextState.email) {
  63. return false
  64. } else {
  65. return true
  66. }
  67. }
  68.  
  69. render () {
  70. return (
  71. <div className='App'>
  72. {console.log(this.state.legitMail)}
  73. <div style={{ display: 'inline-grid' }}>
  74. {console.log(this.state)}
  75. <h2>Sign Up</h2>
  76. <label for='Email'>Email</label>
  77. <div>
  78. <input
  79. style={{ width: '300px' }}
  80. onChange={async e =>
  81. await this.promisfyState({ email: e.target.value })}
  82. id='Email'
  83. name='Email'
  84. type='text'
  85. />
  86. <i
  87. style={{
  88. display: this.state.legitMail ? '' : 'none',
  89. 'margin-left': '-23px'
  90. }}
  91. >
  92. </i>
  93. <i
  94. style={{
  95. display: this.state.legitMail ? 'none' : '',
  96. 'margin-left': '-23px'
  97. }}
  98. >
  99. </i>
  100. </div>
  101.  
  102. <div>
  103. <label for='ConfirmEmail'>Confirm Email</label>
  104. <input
  105. style={{ width: '300px' }}
  106. onChange={e => this.setState({ confirmEmail: e.target.value })}
  107. id='ConfirmEmail'
  108. name='ConfirmEmail'
  109. type='text'
  110. />
  111. <i
  112. style={{
  113. display: this.state.legitMail ? '' : 'none',
  114. 'margin-left': '-23px'
  115. }}
  116. >
  117. </i>
  118. <i
  119. style={{
  120. display: this.state.legitMail ? 'none' : '',
  121. 'margin-left': '-23px'
  122. }}
  123. >
  124. </i>
  125. </div>
  126.  
  127. {/* <label for='Email' class='floatLabel'>User Name</label>
  128. <input
  129. onChange={e => this.setState({ userName: e.target.value })}
  130. id='Email'
  131. name='Email'
  132. type='text'
  133. />
  134.  
  135. <label for='password' class='floatLabel'>Password</label>
  136. <input
  137. onChange={e => this.setState({ password: e.target.value })}
  138. id='password'
  139. name='password'
  140. type='password'
  141. />
  142. <span>Enter a password longer than 8 characters</span>
  143.  
  144. <label for='confirm_password' class='floatLabel'>
  145. Confirm Password
  146. </label>
  147. <input
  148. onChange={e => this.setState({ confirmPassword: e.target.value })}
  149. id='confirm_password'
  150. name='confirm_password'
  151. type='password'
  152. />
  153.  
  154. <div>
  155. <input
  156. onChange={() => {
  157. this.setState({
  158. agreeWithTerms: !this.state.agreeWithTerms
  159. })
  160. }}
  161. id='checkBox'
  162. type='checkbox'
  163. />
  164. <label for='checkBox'>
  165. I agree with the terms
  166. </label>
  167. </div>
  168.  
  169. <input type='submit' value='Create My Account' id='submit' /> */}
  170. </div>
  171. </div>
  172. )
  173. }
  174. }
  175.  
  176. export default App
RAW Paste Data

Adblocker detected! Please consider disabling it...

We've detected AdBlock Plus or some other adblocking software preventing Pastebin.com from fully loading.

We don't have any obnoxious sound, or popup ads, we actively block these annoying types of ads!

Please add Pastebin.com to your ad blocker whitelist or disable your adblocking software.

×