项目作者: exdeniz

项目描述 :
Custom element for basket with counter
高级语言: HTML
项目地址: git://github.com/exdeniz/basket-element.git
创建时间: 2018-08-03T08:36:11Z
项目社区:https://github.com/exdeniz/basket-element

开源协议:MIT License

下载


Custom element basket with counter.

Installation

  1. $ npm install basket-element

Usage

  1. import "basket-element"
  1. <basket-element value="1" href="/cart">
  2. <span>0</span>
  3. <svg></svg>
  4. </basket-element>

Method

Method the <basket-fragment> element.

  • value - Set or get counter.
  • increment - Increment counter.
  • decrement - Decrement counter.
  1. const loader = document.querySelector("basket-element")
  2. const counter = loader.value // get current counter
  3. loader.value = 5 // set counter
  4. loader.increment() // Increment counter. loader.value return 6
  5. loader.decrement() // Decrement counter. loader.value return 5

Options

Attribute Options Description
value value counter default ‘0’
href if element as link if element as link set role=”link” add event to click
role role for element Setup custom role element
aria-label aria-label for element Default ‘basket’
message template for span aria-label example: “In basket {{#}} items”, default: “In basket”

Browser support

Browsers without native custom element support require a polyfill.

  • Chrome
  • Firefox
  • Safari
  • Internet Explorer 11
  • Microsoft Edge

Development

  1. npm install
  2. npm test
  3. npm test-watch

License

Distributed under the MIT license. See LICENSE for details.