Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

151
Views
How to run a function using onClick in React

When I press the sync button, I need to run the Check Routine function. How can I do this ?

const CheckRoutine = require('../routines/check-at');

export default ({ className }) => (
  <ul className={ `nav flex-column ${className || ''}` }>
    <li>
      <button className="btn btn-primary" 
        onClick={CheckRoutine} >
        <i className="fa fa-refresh"> </i>
        <span>Sync</span>
      </button>
    </li>
  </ul>
);```



check-at:

module.exports = atCheck;
function atCheck() {
  console.log("Cheking...");
}
about 4 years ago · Juan Pablo Isaza
3 answers
Answer question

0

If your check Routine is in the same component, you can directly give,

<button className="btn btn-primary" 
        onClick={CheckRoutine} >
        <i className="fa fa-refresh"> </i>
        <span>Sync</span>
      </button>

or If your Check routine is in parent component, you can use call back function inside your component like below.

const CheckRoutine =(event) =>{
event.preventDefault();
props.checkRoutine();
}

<button className="btn btn-primary" 
        onClick={CheckRoutine} >
        <i className="fa fa-refresh"> </i>
        <span>Sync</span>
      </button>
about 4 years ago · Juan Pablo Isaza Report

0

you can use this,

CheckRoutine.js
const CheckRoutine = e => {
console.log(e)
}
export default CheckRoutine


fileName.js
import CheckRoutine from './CheckRoutine'

export default ({ className }) => (
  <ul className={ `nav flex-column ${className || ''}` }>
    <li>
      <button className="btn btn-primary" 
        onClick={CheckRoutine} >
        <i className="fa fa-refresh"> </i>
        <span>Sync</span>
      </button>
    </li>
  </ul>
);

or you can in single file

const CheckRoutine = e => {
 console.log(e)
}
export default ({ className }) => (
  <ul className={ `nav flex-column ${className || ''}` }>
    <li>
      <button className="btn btn-primary" 
        onClick={CheckRoutine} >
        <i className="fa fa-refresh"> </i>
        <span>Sync</span>
      </button>
    </li>
  </ul>
);
about 4 years ago · Juan Pablo Isaza Report

0

import atCheck from '../routines/check-at'

export default ({ className }) => (
<ul className={ `nav flex-column ${className || ''}` }>
    <li>
      <button className="btn btn-primary" 
        onClick={atCheck} >
        <i className="fa fa-refresh"> </i>
        <span>Sync</span>
      </button>
    </li>
  </ul>
);

//../routines/check-at

export default const atCheck => (e) {
  console.log("Cheking...");
}
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!