[Doc] The way to unsubscribe from the events (#4505)

Document Navigation.events() unsubscribe

docs/docs/events.md

 Called once the app is launched. This event is used to set the Application's initial layout - after which the app is ready for user interaction.
 
 ```js
-Navigation.events().registerAppLaunchedListener(() => {
+const appLaunchedListener = Navigation.events().registerAppLaunchedListener(() => {
 
 });
 ```
 
+RNN automatically unsubscribes components when they unmount, therefore unsubscribing isn't actually mandatory if you subscribed in `componentDidMount`.
+
+But you can use the following method to unsubscribe manually.
+
+```js
+appLaunchedListener.remove();
+```
+
 ## componentDidAppear
 Called each time this component appears on screen (attached to the view hierarchy)
 
 ```js
 class MyComponent extends Component {
-  constructor(props) {
-    super(props);
-    Navigation.events().bindComponent(this);
-  }
 
+  componentDidMount() {
+    this.navigationEventListener = Navigation.events().bindComponent(this);
+  }
+  
+  componentWillUnmount() {
+    // Not mandatory
+    if (this.navigationEventListener) {
+      this.navigationEventListener.remove();
+    }
+  }
+  
   componentDidAppear() {
 
   }
 This event can be observed globally as well:
 
 ```js
-Navigation.events().registerComponentDidAppearListener(({ componentId, componentName }) => {
+// Subscribe
+const screenEventListener = Navigation.events().registerComponentDidAppearListener(({ componentId, componentName }) => {
 
 });
+...
+// Unsubscribe
+screenEventListener.remove();
 ```
 |       Parameter         | Description |
 |:--------------------:|:-----|
 
 ```js
 class MyComponent extends Component {
-  constructor(props) {
-    super(props);
-    Navigation.events().bindComponent(this);
+
+  componentDidMount() {
+    this.navigationEventListener = Navigation.events().bindComponent(this);
+  }
+  
+  componentWillUnmount() {
+    // Not mandatory
+    if (this.navigationEventListener) {
+      this.navigationEventListener.remove();
+    }
   }
 
   componentDidDisappear() {
 This event can be observed globally as well:
 
 ```js
-Navigation.events().registerComponentDidDisappearListener(({ componentId, componentName }) => {
+// Subscribe
+const screenEventListener = Navigation.events().registerComponentDidDisappearListener(({ componentId, componentName }) => {
 
 });
+...
+// Unsubscribe
+screenEventListener.remove();
 ```
 |       Parameter         | Description |
 |:--------------------:|:-----|
 The `commandListener` is called whenever a *Navigation command* (i.e push, pop, showModal etc) is invoked.
 
 ```js
-Navigation.events().registerCommandListener(({ name, params }) => {
+// Subscribe
+const commandListener = Navigation.events().registerCommandListener(({ name, params }) => {
 
 });
+...
+// Unsubscribe
+commandListener.remove();
 ```
 |       Parameter         | Description |
 |:--------------------:|:-----|
 Invoked when a command finishes executing in native. If the command contains animations, for example pushed screen animation,) the listener is invoked after the animation ends.
 
 ```js
-Navigation.events().registerCommandCompletedListener(({ commandId, completionTime, params }) => {
+// Subscribe
+const commandCompletedListener = Navigation.events().registerCommandCompletedListener(({ commandId, completionTime, params }) => {
 
 });
+...
+// Unsubscribe
+commandCompletedListener.remove();
 ```
 
 |       Parameter         | Description |
 Invoked when a BottomTab is selected by the user.
 
 ```js
-Navigation.events().registerBottomTabSelectedListener(({ selectedTabIndex, unselectedTabIndex }) => {
+// Subscribe
+const bottomTabEventListener = Navigation.events().registerBottomTabSelectedListener(({ selectedTabIndex, unselectedTabIndex }) => {
 
 });
+...
+// Unsubscribe
+bottomTabEventListener.remove();
 ```
 
 |       Parameter         | Description |
 
 ```js
 class MyComponent extends Component {
-  constructor(props) {
-    super(props);
-    Navigation.events().bindComponent(this);
+
+  componentDidMount() {
+    this.navigationEventListener = Navigation.events().bindComponent(this);
+  }
+  
+  componentWillUnmount() {
+    // Not mandatory
+    if (this.navigationEventListener) {
+      this.navigationEventListener.remove();
+    }
   }
   
   navigationButtonPressed({ buttonId }) {
 This event can be observed globally as well:
 
 ```js
-Navigation.events().registerNavigationButtonPressedListener(({ buttonId }) => {
+// Subscribe
+const navigationButtonEventListener = Navigation.events().registerNavigationButtonPressedListener(({ buttonId }) => {
 
 });
+...
+// Unsubscribe
+navigationButtonEventListener.remove();
 ```
 
 |Parameter|Description|
 
 ```js
 class MyComponent extends Component {
-  constructor(props) {
-    super(props);
-    Navigation.events().bindComponent(this);
+
+  componentDidMount() {
+    this.navigationEventListener = Navigation.events().bindComponent(this);
+  }
+  
+  componentWillUnmount() {
+    // Not mandatory
+    if (this.navigationEventListener) {
+      this.navigationEventListener.remove();
+    }
   }
 
   searchBarUpdated({ text, isFocused }) {
 
 ```js
 class MyComponent extends Component {
-  constructor(props) {
-    super(props);
-    Navigation.events().bindComponent(this);
+
+  componentDidMount() {
+    this.navigationEventListener = Navigation.events().bindComponent(this);
+  }
+  
+  componentWillUnmount() {
+    // Not mandatory
+    if (this.navigationEventListener) {
+      this.navigationEventListener.remove();
+    }
   }
 
   searchBarCancelPressed() {
 
 ```js
 class MyComponent extends Component {
-  constructor(props) {
-    super(props);
-    Navigation.events().bindComponent(this);
+
+  componentDidMount() {
+    this.navigationEventListener = Navigation.events().bindComponent(this);
+  }
+  
+  componentWillUnmount() {
+    // Not mandatory
+    if (this.navigationEventListener) {
+      this.navigationEventListener.remove();
+    }
   }
 
   previewCompleted({ previewComponentId }) {
 
   }
 }
-```
+```