Home / Questions / 385846
Accepted
floyd70s
Asked: 2020-08-30 12:04:25 +0800 CST 2020-08-30 12:04:25 +0800 CST

React Files (.JS) and Files (.EJS)

  • 772

I am working on a project in react with bootstrap, and the situation is as follows:

  • when clicking a button with react I need a payment flow to be started in transbank. this is the TBK repo for node where an example tbk node comes

and the example is made in an .ejs template that mails over express.

here it calls to start the transaction:

 <span><a class="text-blue-600 hover:no-underline underline" href="webpay-normal/init">Iniciar transacción</a></span>

and the payment flow begins.

what I need to do is the same but from my .js file the transaction is started:

import React, { Component } from 'react';

export default class Instructions extends Component {
  handleClick (e) {
    console.log(e)
    console.log(e.nativeEvent)
    alert('acá se debe iniciar la transaccion')
  }
  render() {
    return(
      <div>
        <h4>Eventos</h4>
        <button onClick={this.handleClick}>iniciar transaccion</button>
      </div>
    )
  }
}

your help either with a youtube video, link or whatever to solve this problem I have, thank you very much in advance.

javascript

1 Answers

  1. Best Answer

    You can achieve this with a common js call:

      handleClick (e) {
    console.log(e)
    console.log(e.nativeEvent)
    window.location.pathname = "webpay-normal/init"
  }

    Although if you want to do it as a transition with pure react, you should try to implement react-router in your project and then do something like:

    TuComponente.contextTypes = {
  router: React.PropTypes.func.isRequired
};
  // ...

  handleClick (e) {
    console.log(e)
    console.log(e.nativeEvent)
    this.context.router.transitionTo("webpay-normal/init")
  }
    • 1