SHARE
TWEET

Untitled

xapu Oct 23rd, 2017 61 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. import React from 'react'
  2. import ReactDOM from 'react-dom'
  3.  
  4. let DemoFunc = props => {
  5.   function s (props) {
  6.     if (props.mood === ':|') {
  7.       console.log('y')
  8.       return 'Im |'
  9.     }
  10.     if (props.mood === ':)') {
  11.       return 'Im )'
  12.     }
  13.     if (props.mood === ':|') {
  14.       return 'Im (|)'
  15.     }
  16.   }
  17.  
  18.   return (
  19.     <div>
  20.       <div> Hello    {s(props.mood).bind}</div>
  21.       <div> Hello {props.mood}</div>
  22.     </div>
  23.   )
  24. }
  25.  
  26. class Mood extends React.Component {
  27.   constructor (props) {
  28.     super(props)
  29.     this.state = { mood: ':|' }
  30.   }
  31.   render () {
  32.     return (
  33.       <div>
  34.         <span
  35.           style={{
  36.             fontSize: '60',
  37.             border: '1px solid #333',
  38.             cursor: 'pointer'
  39.           }}
  40.           onClick={this.changeMood.bind(this)}
  41.         >
  42.           {this.state.mood}
  43.  
  44.         </span>
  45.         <DemoFunc mood={this.state.mood} />
  46.         <div>To</div>
  47.       </div>
  48.     )
  49.   }
  50.   changeMood (elem) {
  51.     const moods = [':)', ':|', ':(']
  52.     const current = moods.indexOf(elem.target.textContent)
  53.     this.setState({ mood: current === 2 ? moods[0] : moods[current + 1] })
  54.   }
  55. }
  56.  
  57. ReactDOM.render(<Mood />, root)
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!
 
Top