1.0.12 • Published 2 years ago

@wix/velo-bind v1.0.12

Weekly downloads
-
License
MIT
Repository
-
Last release
2 years ago

Velo Bind

Documentation

velo-bind uses mobx to bring a reactive programming to Velo and bind wix elements.

Installation

This module is aimed to be used in Wix Velo environment.

  1. Open a Wix Site
  2. Enable Dev Mode
  3. Add @wix/velo-bind npm module

Follow the installation instructions to learn more.

Examples

Counter

Given a site with a text element with the ID #counter, a #decrement and #increment buttons:

import { makeAutoObservable, bind } from "@wix/velo-bind";

const state = makeAutoObservable({
  count: 0,
});

const { counter, increment, decrement } = bind($w);
counter.text = () => `${state.count}`;
increment.onClick(() => state.count++);
decrement.onClick(() => state.count--);

Working with repeaters

A Repeater is a special Wix Editor Element which is responsible for generating a list of elements from either a data-set (dynamic) or an array set by Velo code).

import { makeAutoObservable, bind } from "@wix/velo-bind";

const state = makeAutoObservable({
  list: [{ value: "myValue" }],
});
const { repeater } = bind($w);
repeater.item = ($item, data, index) => {
  const { label } = bind($item);
  label.text = () => list[index].value;
};
1.0.12

2 years ago

1.0.2

2 years ago

1.0.1

2 years ago

1.0.9

2 years ago

1.0.8

2 years ago

1.0.7

2 years ago

1.0.6

2 years ago

1.0.5

2 years ago

1.0.4

2 years ago

1.0.3

2 years ago

1.0.11

2 years ago

1.0.10

2 years ago

1.0.0

2 years ago