5

Masterpass Turkey Package for React Native

 2 years ago
source link: https://reactnativeexample.com/masterpass-turkey-package-for-react-native/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

React Native Masterpass TR

Masterpass Turkey Package for React Native

Installation

npm install @macellan/react-native-masterpass-tr --save

yarn add @macellan/react-native-masterpass-tr

Install Dependencies

Please, install dependencies for using this package.

yarn add react-native-webview react-native-event-listeners

Usage

Wrap your parent component in Provider from react-native-masterpass-tr.

import * as React from 'react';
import { MasterPassProvider, IConfig } from 'react-native-masterpass-tr';

const ParentComponent: React.FC = () => {

  /* MasterPass Config Object */
  const config: IConfig = {
    token: '',
    serviceUrl: '',
    clientId: '',
    userId: '',
    sendSmsLanguage: '',
    sendSms: '',
    referenceNo: '',
    clientIp: '',
    sdkUrl: '',
  };

  return (
    <MasterPassProvider config={config}>
      <ChildComponent />
      {/* Other Child Components */}
    </MasterPassProvider>;
  );
}

export default ParentComponent;
React TSX

Add MasterPassTurkey to the component you want to use.

import * as React from 'react';
import {
  MasterPassTurkey,
  IMasterPassTurkeyRefs,
} from 'react-native-masterpass-tr';

const ChildComponent: React.FC = () => {
  const masterpass = React.useRef<IMasterPassTurkeyRefs>(null);

  const onRegistrationCheck = React.useCallback(() => {
    masterpass.current
      ?.registrationCheck()
      .then((result) => {
        console.log(result);
      })
      .catch((error) => {
        console.log(error);
      });
  }, []);

  return <MasterPassTurkey ref={ref} />;
};

export default ChildComponent;
React TSX

License

GitHub

https://github.com/macellan/react-native-masterpass-tr?ref=reactnativeexample.com


report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK