# withEventrixState

Use eventrix state and rerender component when eventrix state change.

{% hint style="info" %}
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.
{% endhint %}

{% tabs %}
{% tab title="Javascript" %}

```jsx
import React from 'react';
import { withEventrixState } from 'eventrix';

class UsersList extends React.Component {
    render() {
        const { users } = this.props;
        return (
            <div>
                {users.map(user => <div>{user.name}</div>)}
            </div>
        );
    }
}

export default withEventrixState(UsersList, ['users']);
```

{% endtab %}

{% tab title="Typescript" %}

```typescript
import React from 'react';
import { withEventrixState } from 'eventrix';
import { UserI, PropsI } from './interfaces';

interface StateI {
    users: UserI[];
}

class UsersList extends React.Component {
    render() {
        const { users } = this.props;
        return (
            <div>
                {users.map(user => <div>{user.name}</div>)}
            </div>
        );
    }
}

export default withEventrixState<StateI, PropsI>(UsersList, ['users']);
```

{% endtab %}
{% endtabs %}