Listening to Events

JavaScript

You can listen to InfiniteGrid's events with InfiniteGrid#on

// If you're using a package manager

ig.on("requestAppend", evt => {
  console.log(evt);
});

React

All events are prefixed with on-, and camelCased.

import { MasonryInfiniteGrid } from "@egjs/react-infinitegrid";
import { OnRequestAppend } from "@egjs/infinitegrid";

<MasonryInfiniteGrid
  onRequestAppend={(e: OnRequestAppend) => {
    console.log(e);
  }}
>
  {...}
</MasonryInfiniteGrid>

Vue@2

All event names are renamed to kebab-case, following the Vue event naming convention.

<MasonryInfiniteGrid
  @request-append="onRequestAppend"
>
</MasonryInfiniteGrid>

Vue@3

All event names are renamed to kebab-case, following the Vue 2 event naming convention.

<MasonryInfiniteGrid
  @request-append="onRequestAppend"
>
</MasonryInfiniteGrid>

Angular

You can listen events of the ngx-infinitegrid using Angular's event binding.

<ngx-masonry-infinite-grid
  (requestAppend)="onRequestAppend($event)">
  {{ ... }}
</ngx-masonry-infinite-grid>

Svelte

You can use on:eventName syntax to listen InfiniteGrid events.
All event properties are available in the event's detail property.

<script lang="ts">
  import { MasonryInfiniteGrid } from "@egjs/svelte-infinitegrid";
</script>

<MasonryInfiniteGrid
  on:requestAppend={({ detail: e }) => {
  console.log(e);
  }}>
</MasonryInfiniteGrid>

See all available events at InfiniteGrid#events.