@glimmer/tracking

  • Version 1.1.2
  • Published
  • 63.4 kB
  • 2 dependencies
  • MIT license

Install

npm i @glimmer/tracking
yarn add @glimmer/tracking
pnpm add @glimmer/tracking

Overview

Glimmer property tracking library

Index

Variables

variable tracked

let tracked: PropertyDecorator;
  • Example 1

    import Component from '@glimmer/component';
    import { tracked } from '@glimmer/tracking';
    export default class MyComponent extends Component {
    @tracked
    remainingApples = 10
    }

    When something changes the component's remainingApples property, the rerender will be scheduled.

    Example 2

    Computed Properties

    In the case that you have a getter that depends on other properties, tracked properties accessed within the getter will automatically be tracked for you. That means when any of those dependent tracked properties is changed, a rerender of the component will be scheduled.

    In the following example we have two properties, eatenApples, and remainingApples.

    import Component from '@glimmer/component';
    import { tracked } from '@glimmer/tracking';
    const totalApples = 100;
    export default class MyComponent extends Component {
    @tracked
    eatenApples = 0
    get remainingApples() {
    return totalApples - this.eatenApples;
    }
    increment() {
    this.eatenApples = this.eatenApples + 1;
    }
    }

Functions

function setPropertyDidChange

setPropertyDidChange: (cb: () => void) => void;

    Package Files (2)

    Dependencies (2)

    Dev Dependencies (5)

    Peer Dependencies (0)

    No peer dependencies.

    Badge

    To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

    You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@glimmer/tracking.

    • Markdown
      [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/@glimmer/tracking)
    • HTML
      <a href="https://www.jsdocs.io/package/@glimmer/tracking"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>