Skip to content

Instantly share code, notes, and snippets.

@dhaniksahni
Created October 2, 2019 13:40
Show Gist options
  • Save dhaniksahni/c1ab01cceab808c6bc26751753a22b89 to your computer and use it in GitHub Desktop.
Save dhaniksahni/c1ab01cceab808c6bc26751753a22b89 to your computer and use it in GitHub Desktop.
Paginator Lightning Web Component
<template>
<lightning-layout>
<lightning-layout-item>
<lightning-button label="Previous" icon-name="utility:chevronleft" onclick={previousHandler}></lightning-button>
</lightning-layout-item>
<lightning-layout-item flexibility="grow"></lightning-layout-item>
<lightning-layout-item>
<lightning-button label="Next" icon-name="utility:chevronright" icon-position="right" onclick={nextHandler}></lightning-button>
</lightning-layout-item>
</lightning-layout>
</template>
import { LightningElement } from 'lwc';
export default class Paginator extends LightningElement {
previousHandler() {
this.dispatchEvent(new CustomEvent('previous'));
}
nextHandler() {
this.dispatchEvent(new CustomEvent('next'));
}
}
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata" fqn="paginator">
<apiVersion>46.0</apiVersion>
<isExposed>true</isExposed>
<targets>
<target>lightning__RecordPage</target>
<target>lightning__AppPage</target>
<target>lightning__HomePage</target>
</targets>
</LightningComponentBundle>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment