FunctionComponent.js

import React, { useEffect } from 'react';
import {
  Button,
  Icon,
} from 'native-base';
import { inject, useObserver } from 'mobx-react';

import withCommonProps from './withCommonProps'; // HOC ( Higher Order Component )

const SomeComponent = ({
  dataStore, // inject from MobX
  showError, // inject from HOC
}) => {
  useEffect(() => {
    // dataStore.fetch() method is loader to data which treat.
    dataStore.fetch().catch((e) => showError(e));
  }, [dataStore, showError]);

  return useObserver(() => (
    <Button
      onPress={() => {
        // dataStore.delete() method is a function to delete data which treat.
        dataStore.delete().catch((e) => showError(e));
      }}
    >
      <Icon active name="trash" />
    </Button>
  ));
};

const component = withCommonProps(inject('dataStore')(SomeComponent));
export default component;