Nerfing Powerful Megalomaniacs
Unleash awesomeness. Private packages, team management tools, and powerful integrations. Get started with npm Orgs »

riot-ss

0.0.2 • Public • Published

Riot.js SVG Sprite Component

Installation

npm ins riot-ss --save-dev

Import script

<script src="riot.ss.min.js"></script>

Webpack or Browserify:

require('riot-ss')

What is the problems for use riot in svg

Original HTML <use> element usage:

<svg><use xlink:href="#symbol_id" /></svg>

In riot.js may you try:

<svg><use xlink:href="#{symbol_id}" /></svg>

!!! DOESN'T WORK WHY? Because <use> element can't dynamic change xlink:href attriabute for link symbol #id

Use svg srpite component

<ss link="{symbol_id}"></ss>
this.symbol_id = 'edit'

yield:

<svg><use xlink:href="#edit" /></svg>

Congratulation !!! Shorten and work fine now.

Note: Please without # syntax, component will add this automated.

Options

  • link link to symbol #id

  • class set class name

Keywords

install

npm i riot-ss

Downloadsweekly downloads

0

version

0.0.2

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar
Report a vulnerability