ml-topbar-apps v0.0.19

Ml Topbar Apps

Propriedades

Properties

Como usar esse componente

React

• Instalar o pacote no seu projeto. Ex: npm install ml-topbar-apps
• Se o seu projeto foi criado utilizando o create-react-app você precisará executar a função defineCustomElements() no seu index.js. Caso a sua aplicação necessite ser executada no IE é necessário executar o applyPolyfills() também. Veja o exemplo abaixo.

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';

import { applyPolyfills, defineCustomElements } from 'ml-topbar-apps/loader';

ReactDOM.render(<App />, document.getElementById('root'));
registerServiceWorker();

applyPolyfills().then(() => {
  defineCustomElements();
});

• Para o correto funcionamento é necessário encapsular o componente dentro de um componente React como o exemplo abaixo:

import React, { useRef, useEffect } from 'react'

const TopbarApps = ({ apps, user, iconsColor }) => {
  const elementRef = useRef(null)

  useEffect(() => {
    elementRef.current.user = user
    elementRef.current.iconsColor = iconsColor
  }, [apps, user])

  return <ml-topbar-apps ref={elementRef}></ml-topbar-apps>
}

export default TopbarApps