问一个组件只挂载一次，不要再卸载一次

EN

Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and async task in a useEffect cleanup function

import React, {useState, useEffect} from 'react';
import {DeviceEventEmitter } from 'react-native';

import DataOperations from "../../../../lib/databaseOperations"

const CommStatus: () => React$Node = () => {
  let [status, updateStatus] = useState('');
  const db = new DataOperations();

  const onCommStatus = (event) => {
    status = event['status'];
    updateStatus(status);
  };

  const startSyncing = () => {
    db.startSyncing();
  };


const listner = DeviceEventEmitter.addListener(
  'syncStatusChanged',
  onCommStatus,
);

 //NOT SURE THIS AS AN EFFECT
  const removeListner = () =>{
    DeviceEventEmitter.removeListener(listner)
  }

  //REMOVING THIS useEffect hides the error
  useEffect(() => {
    startSyncing();
    return ()=>removeListner(); // just added this to try
  }, []);



  //TODO: find icons for stopped and idle. And perhaps animate BUSY?
  const renderIcon = (status) => {
    //STOPPED and IDLE are same here.
    if (status == 'BUSY') {
      return (
        <Icon          
          name="trending-down"
        />
      );
    } else if (status == 'IS_CONNECTING') {
      ...another icon
    }
  };

  renderIcon();

  return <>{renderIcon(status)}</>;
};


export default CommStatus;

  headerRight: () => (
    <>
    <CommStatus/>
    </>
  ),