{"action":"closed","issue":{"url":"https://api.github.com/repos/nitin42/react-imgpro/issues/11","repository_url":"https://api.github.com/repos/nitin42/react-imgpro","labels_url":"https://api.github.com/repos/nitin42/react-imgpro/issues/11/labels{/name}","comments_url":"https://api.github.com/repos/nitin42/react-imgpro/issues/11/comments","events_url":"https://api.github.com/repos/nitin42/react-imgpro/issues/11/events","html_url":"https://github.com/nitin42/react-imgpro/issues/11","id":309339580,"number":11,"title":"How can i update props on button click","user":{"login":"anilljoshi","id":20184650,"avatar_url":"https://avatars2.githubusercontent.com/u/20184650?v=4","gravatar_id":"","url":"https://api.github.com/users/anilljoshi","html_url":"https://github.com/anilljoshi","followers_url":"https://api.github.com/users/anilljoshi/followers","following_url":"https://api.github.com/users/anilljoshi/following{/other_user}","gists_url":"https://api.github.com/users/anilljoshi/gists{/gist_id}","starred_url":"https://api.github.com/users/anilljoshi/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/anilljoshi/subscriptions","organizations_url":"https://api.github.com/users/anilljoshi/orgs","repos_url":"https://api.github.com/users/anilljoshi/repos","events_url":"https://api.github.com/users/anilljoshi/events{/privacy}","received_events_url":"https://api.github.com/users/anilljoshi/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":15,"created_at":"2018-03-28T12:09:52Z","updated_at":"2018-04-25T01:09:45Z","closed_at":"2018-04-25T01:09:45Z","author_association":"NONE","body":"Here is my code and i want to change greyscale to true on button click using function that.editType('greyscale') \r\n\r\nimport React, { Component } from 'react';\r\nimport ProcessImage from 'react-imgpro';\r\nimport styles from '../style.scss';\r\n\r\nconst style = {\r\n  container:{\r\n    display:'flex',\r\n    alignItems:'center',\r\n    height:'100%'\r\n  },\r\n  itemContainer:{\r\n    left:0\r\n  },\r\n  bgImgaesContainer:{\r\n    width:'100%',\r\n    left:0\r\n  }\r\n}\r\n\r\nclass PostEditImage extends Component{\r\n\r\n  state = {\r\n    src: '',\r\n    err: null,\r\n    greyscale:false\r\n  }\r\n\r\n  editType=(type)=>{\r\n    switch(type){\r\n      case 'greyscale':\r\n        this.setState({greyscale:true})\r\n        break;\r\n    }\r\n  }\r\n\r\n render(){\r\n  var w = window.innerWidth;\r\n  var that =this;\r\n  return(\r\n    <div style={style.container}>\r\n      <ProcessImage\r\n        image={'http://365.unsplash.com/assets/paul-jarvis-9530891001e7f4ccfcef9f3d7a2afecd.jpg'}\r\n        resize={{ width: w}}\r\n        greyscale={that.state.greyscale} \r\n        \r\n      />\r\n      <div style={style.bgImgaesContainer} className={`${styles.bgImgaesContainer} ${styles.width90}`}>\r\n        <div style={style.itemContainer} className={styles.itemContainer}>\r\n              <div onClick={(e)=>that.editType('greyscale')} style={{backgroundColor:'#000'}} className={`${styles.item} ${styles.item1}`}>\r\n                greyscale\r\n              </div>\r\n              <div onClick={(e)=>that.editType('greyscale')} style={{backgroundColor:'#a52a2a'}} className={`${styles.item} ${styles.item2}`}>\r\n                2\r\n              </div>\r\n              <div onClick={(e)=>that.editType()} style={{backgroundColor:'#d2691e'}} className={`${styles.item} ${styles.item3}`}>\r\n                3\r\n              </div>\r\n              <div onClick={(e)=>that.editType()} style={{backgroundColor:'#0000ff'}} className={`${styles.item} ${styles.item4}`}>\r\n                4\r\n              </div>\r\n              <div onClick={(e)=>that.editType()} style={{backgroundColor:'#e9967a'}} className={`${styles.item} ${styles.item5}`}>\r\n                5\r\n              </div>\r\n              <div onClick={(e)=>that.editType()} style={{backgroundColor:'#556b2f'}} className={`${styles.item} ${styles.item5}`}>\r\n                6\r\n              </div>\r\n              <div onClick={(e)=>that.editType()} style={{backgroundColor:'#cd5c5c'}} className={`${styles.item} ${styles.item5}`}>\r\n                7\r\n              </div>\r\n              <div onClick={(e)=>that.editType()} style={{backgroundColor:'#800000'}} className={`${styles.item} ${styles.item5}`}>\r\n                8\r\n              </div>\r\n              <div onClick={(e)=>that.editType()} style={{backgroundColor:'#f96332'}} className={`${styles.item} ${styles.item5}`}>\r\n                9\r\n              </div>\r\n              <div onClick={(e)=>that.editType()} style={{backgroundColor:'#c0c0c0'}} className={`${styles.item} ${styles.item5}`}>\r\n                7\r\n              </div>\r\n              <div onClick={(e)=>that.editType()} style={{backgroundColor:'#4682b4'}} className={`${styles.item} ${styles.item5}`}>\r\n                8\r\n              </div>\r\n              <div onClick={(e)=>that.editType()} style={{backgroundColor:'#006400'}} className={`${styles.item} ${styles.item5}`}>\r\n                9\r\n              </div>\r\n        </div>\r\n      </div>  \r\n    </div>\r\n  )\r\n }\r\n};\r\n\r\n\r\nexport default PostEditImage;\r\n"}}
{"actor":{"display_login":"Sunshine168"}}