Tokenizer
Overview
The Tokenizer component helps process and manage multiple values simultaneously in an input field. Each item is separated into individual "tokens" and managed as a collection whenever the user enters a value. It is useful in situations where multiple values need to be entered and managed at once, such as email address input, tag input, and recipient list management.
Key Features
1. Custom Renderer
You can render each item in the suggestion list in any desired form. You can freely combine text, images, buttons, etc. to express items.
View Related Items
- Properties
2. Suggestion List State Handling
Improves user experience by visually displaying the state when the recommendation list is loading or when there is no data.
View Related Items
- Properties
3. Suggestion List Configuration
You can customize the logic for constructing recommendation lists related to entered text to apply various recommendation criteria (e.g., API calls, local data filtering, etc.).
View Related Items
- Properties
4. Label and Placeholder
Set label
and placeholder
in the input field to clearly guide users about the input purpose and format.
View Related Items
- Properties
5. Minimum Character Specification
You can set how many characters need to be entered before recommendations start to prevent unnecessary suggestions from appearing when users enter very short words.
View Related Items
- Properties
6. Suggestion List Container Control
Provides automatic and manual closing functionality for the recommendation list container to help users conveniently manage the recommendation list.
View Related Items
- Properties
7. Token Creation and Deletion
Tokens are created based on values entered by users or selected from the suggestion list, and the created tokens are managed as a collection. Additionally, it provides functionality to delete individual tokens or initialize all tokens as needed.
View Related Items
- Properties
label, suggestSource, labelField, clearable, allowInputValue, delimiterOnKeys