react-word-splitter
v1.1.1
Published
This module enables devlopper to split words into word with span tag with react
Downloads
25
Readme
React-Word-Splitter
This module is React/Next Component, which makes words splitted by word or char with span tag and specific attribute.
Installation
This module is available as an npm package.
// with npm
npm install react-word-splitter
// with yarn
yarn add react-word-splitter
Usage
Here is a quick example to get you started, it's all you need:
import React from "react";
import Splitter from "react-word-splitter";
export default function(){
return(
<Splitter
rule="chars"
eachClass="testClass"
eachIdWithIndex="testID"
indexOption="number"
words="あいうえお"
/> // <span class='testClass' id='testID__1'>あ</span><span class='testClass' id='testID__2'>い</span><span class='testClass' id='testID__3'>う</span><span class='testClass' id='testID__4'>え</span><span class='testClass' id='testID__5'>お</span>
)
}
If you want to know in detail, Please check API set below.
API
| Property | type | detail | |:--------:|:----:|:------:| |rule|"words" | "chars"| set split option| |eachClass|string|set common class each element has| |eachIdWithIndex|string|set ID each element has with Index| |indexOption|"number" | string[] |set option about index| |words|string|words which you want to split|