Custom Module

With customModules we can add 3rd party modules (databases, googlelogin, firebase etc) to Nano and use them in methods of any components.

For example, let create a custom module named Addition which adds two numbers and returns the result and use it in Nano.

Lets first define our Addition module

Addition.js

class Addition {
  constructor() {}
  add(num1, num2) {
    return num1 + num2
  }
}

var addition = null;

const getAddition = () => {
  if (addition == null) {
    addition = new Addition();
  }
  return addition;
};

export default getAddition;

So, the packages object will look like

CustomPackage.js

import Addition from 'Addition'

const customPackage = {
    name:'my_custom_package',
    modules:[{
        name:'custom_addition_module', // name to access module in `moduleParams`
        module:Addition, // actual module
    }]
};
export default customPackage;

Now lets give our customPackage to packages prop. packages prop takes an array of packages. So it will be

import {NanoApp} from  'react-native-nano';

import CustomPackage from 'CustomPackage'

const  App = () => {
    return <NanoApp packages={[CustomPackage]} screens={[screen]} />;
};
export  default  App;

Now, lets use our new Addition module in our Nano App. All the customModules provided in packages are available in the moduleParams array available in all methods in Nano. We can access our custom Addition module via its name custom_addition_module that we have defined earlier.

const  customView = {
  name:"button",
  component:  'button,
  value:"Hello",
  props: {
      style: {
          alignSelf:  'center',
          justifyContent:  'center'
          backgroundColor:'blue',
      }
  }
  onPress:({moduleParams})=>{
    const {custom_addition_module} = moduleParams;
    const sum = custom_addition_module.add(2,5);
    // use the sum value as required
  }
};