Comment on page
useEmit

This hook return eventrix emit method
If You want use hooks, hocs or component decorator You must use EventrixProvider in Your application. Go to "EventrixProvider" page in "Context" section for more details.
Javascript
Typescript
import React, { useCallback } from 'react';
import { useEmit } from 'eventrix';
​
const RemoveUserButton = ({ user }) => {
    const emit = useEmit();
    const removeUser = useCallback(() => {
        emit('removeUser', user)
    }, [emit, user]);
    return (
        <button onClick={removeUser}>
            Remove user
        </button>
    );
}
import React, { useCallback } from 'react';
import { useEmit } from 'eventrix';
import { User } from './interfaces';
​
interface PropsI {
    user: User;
}
​
const RemoveUserButton = ({ user }: PropsI) => {
    const emit = useEmit<User>();
    const removeUser = useCallback(() => {
        emit('removeUser', user)
    }, [emit, user]);
    return (
        <button onClick={removeUser}>
            Remove user
        </button>
    );
}
You can also use emit with event factory method
Javascript
Typescript
import React, { useCallback } from 'react';
import { useEmit } from 'eventrix';
​
const removeUserEvent = (eventData) => {
    const removeUserEventName = 'removeUser';
    return [removeUserEventName, eventData];
}
​
const RemoveUserButton = ({ user }) => {
    const emit = useEmit();
    const removeUser = useCallback(() => {
        emit(removeUserEvent(user));
    }, [emit, user]);
    return (
        <button onClick={removeUser}>
            Remove user
        </button>
    );
}
import React, { useCallback } from 'react';
import { useEmit } from 'eventrix';
import { User } from './interfaces';
​
interface PropsI {
    user: User;
}
​
const removeUserEvent = (eventData: User): [string, User] => {
    const removeUserEventName = 'removeUser';
    return [removeUserEventName, eventData];
}
​
const RemoveUserButton = ({ user }: PropsI) => {
    const emit = useEmit<User>();
    const removeUser = useCallback(() => {
        emit(removeUserEvent(user));
    }, [emit, user]);
    return (
        <button onClick={removeUser}>
            Remove user
        </button>
    );
}
HOOKS - Previous
useEventrixState
Next - HOOKS
useEvent
Last modified 2yr ago