Hello Friends 👋,
Welcome To Infinitbility! ❤️
This tutorial will help you to create common functions like helpers in react native and how to use them in react native screen.
Here you will get
- How to create functions in react native
- How to export those functions in react native
- How to import or use functions in react native
Let start today’s article how to create and use the function in react-native
Here, I am assuming you guys already have created a project with screens.
First, we have to create a functions file with multiple functions like this and also we will see how to export functions.
functions.js
1export function functionOne() {2 return “1”;3}45export function functionTwo() {6 return “2”;7}
On the functions.js
file, we have created two functions where they are returning values;
We are using the keyword export
before the function keyword because we want to use this function in other files. If you want to use the function in the same file then you haven’t need export
functionality.
Let see how we can use these common functions in react native components file.
Well if want use those functions then first we have to import function like on below example.
ReactNativeComponents.js
1import React from 'react';2import {functionOne, functionTwo} from 'functions';3import { View, Text } from 'react-native';45class ReactNativeComponents extends React.Component {6 constructor(props){7 super(props);8 }910 componentDidMount() {11 this.callFunction();12 }1314 callFunction(){15 //do stuff.16 // foo==bar17 functionOne(data);18 functionTwo(data)19 }20 render() {21 return (22 <View>23 <Text>React Components</Text>24 </View>25 );26 }27}2829export default ReactNativeComponents;
Thanks for reading…
Follow me on Twitter
Join our email list and get notified about new content
No worries, I respect your privacy and I will never abuse your email.
Every week, on Tuesday, you will receive a list of free tutorials I made during the week (I write one every day) and news on other training products I create.