how to send prop on a click of button in react code example

Example 1: get value of input element on button click react

const input = props => {

let textInput = React.createRef();

function handleClick() {
  console.log(textInput.current.value);
}

return (
    <div>
      <input ref={textInput} placeholder="Type a message..." />
      <div onClick={handleClick} className="icon">
        <i className="fa fa-play" />
      </div>
    </div>
  )
}

Example 2: react onclick parameter

import React from 'react';

const ExampleComponent = () => {
  
  function sayHello(name) {
    alert(`hello, ${name}`);
  }
  
  return (
    <button onClick={() => sayHello('James')}>Greet</button>
  );
}

export default ExampleComponent;

Example 3: react onclick to make another button

import React from 'react';

const App = () => {
  
const message = () => {
 console.log("Hello World!") 
}

return (
<button onClick={message}> Press me to print a message! </button>
  );
}

Example 4: send props from one component to another on button click

<div>
<button>View Order</button>
    <p><span>{this.props.orderno}</span> 
    <span>{this.props.title}</span></p>
    <p>{this.props.entity} - {this.props.po}</p>
    <p>Due {this.props.duedate}</p>
</div>

Tags:

Html Example