Skip to content

Instantly share code, notes, and snippets.

@ahmedmusawir
Created August 18, 2018 09:55
Show Gist options
  • Save ahmedmusawir/f20537c600e015a50abacec52708716e to your computer and use it in GitHub Desktop.
Save ahmedmusawir/f20537c600e015a50abacec52708716e to your computer and use it in GitHub Desktop.
REACT - EVENTS WITH PASSING PARAMS
import React, { Component } from 'react';
import PropTypes from 'prop-types';
export class Contact extends Component {
state = {};
onShowClick = (name, email, e) => {
console.log(this.state);
console.log(name, email, e.target);
};
render() {
let { name, email, phone } = this.props;
return (
<div className="col-sm-6 col-md-6 col-lg-6">
<div className="card card-body mb-3">
<h4>
{name}
<i
className="fa fa-arrow-circle-down float-right"
aria-hidden="true"
onClick={this.onShowClick.bind(this, name, email)}
/>
</h4>
<ul className="list-group">
<li className="list-group-item">
<strong className="text-danger">
<i className="fa fa-phone-square" aria-hidden="true" /> Phone:
</strong>{' '}
{email}
</li>
<li className="list-group-item">
<strong className="text-danger">
<i className="fa fa-envelope" aria-hidden="true" /> Email:
</strong>{' '}
{phone}
</li>
</ul>
</div>
</div>
);
}
}
Contact.propTypes = {
name: PropTypes.string.isRequired,
email: PropTypes.string.isRequired,
phone: PropTypes.string.isRequired
};
export default Contact;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment