67
rated 0 times
[
69]
[
2]
/ answers: 1 / hits: 15489
/ 8 Years ago, tue, december 6, 2016, 12:00:00
I am new to React js.I am little bit confused that how get id and onChange evt value at the same time when all the data inside map function.Yes there are already answers out there but nothing worked for me.Any method or help would be appreciated.
Thanks in advance.
import React from 'react'
import {connect} from 'react-redux'
class Upload extends React.Component{
constructor(props){
super(props);
this.handleChangeSinglePost = this.handleChangeSinglePost.bind(this)
this.handleID = this.handleID.bind(this)
}
handleChangeSinglePost(data){
console.log(data)//Get the input//Not working
}
handleID(e){
console.log(e.target.value)get the Id
}
renderMaptheSingleUpload(){
return(
this.props.photos.photos.map((data) => {
return(
<div key={data.id} className=WholeWrapperForSingleUpload>
<div className=imageContainerUpload>
<img src={data.blobData} />
</div>
<div className=ImageTitleForUpload>
<form onChange={this.handleID}>
<input onChange={this.handleChangeSinglePost(data.id)} name=caption type=text placeholder=Caption This />
</form>
</div>
</div>
)
})
)
}
render(){
// console.log(this.props.photos)
return(
<div className=UploaContainer>
<div className=UploadContainerContents>
{this.renderMaptheSingleUpload()}
<div className=tagsForupload>
<ul>
<li>OrdinaryLife</li>
<li>OrdinaryLife</li>
<li>OrdinaryLife</li>
<li>OrdinaryLife</li>
<li>OrdinaryLife</li>
</ul>
</div>
<div className=TagItForUpload>
<form>
<input type=text placeholder=Tag it />
<input type=submit defaultValue=Post />
</form>
<div className=suggestionSystemForTagging>
<ul>
<li>Drake</li>
<li>LetMeChoose</li>
<li>LetMeChoose</li>
<li>LetMeChoose</li>
<li>LetMeChoose</li>
<li>LetMeChoose</li>
<li>LetMeChoose</li>
<li>LetMeChoose</li>
</ul>
</div>
</div>
</div>
</div>
)
}
}
const mapStateToProps = (state) => {
return {
photos:state.photoUpload
}
};
export default connect(mapStateToProps)(Upload)
More From » reactjs
