⚪
Vuetify-Form-Base
  • Introduction
  • News & Changes
  • Quickstart
    • Start with
    • Installation
    • Intro
    • Features
    • License
  • Form
    • Validation
  • Component
    • Async Loading
    • Attributes
    • From Schema to Component
    • Events
    • Grid
    • Slots
    • CSS
    • Custom Components
    • Tooltips
  • Schema
    • General
    • Autogeneration
    • Computed Schema
    • Display & Typography
    • Grouping Controls
    • Arrays
  • Input & Controls
    • Text-Field & Input
    • Checkbox, Switch & Sliders
    • Radio Buttons
    • Buttons
    • Select, Combo & Autocomplete
    • Lists & Treeviews
    • Date, Time & Color
    • Icons & Images
Powered by GitBook
On this page
  • Definition
  • Tooltip from String
  • Tooltip from Object
  • Slot
  • Example

Was this helpful?

  1. Component

Tooltips

A tooltip is a brief, informative message that appears when a user interacts with an control

Definition

Each tooltip, even a slot-tooltip, is activated by schema property tooltip . Tooltip could be a string or an object.

Tooltip from String

schema:{
    // tooltip: string
    name: { type:'text', tooltip:'Name' }
}

Tooltip from Object

schema:{
    // tooltip: object
    name: { type:'text', tooltip:{ color:'red', label:'Name'} }
}

Slot

<v-form-base
  :model="model"
  :schema="schema"
  @input="inputHandler"
>

  <!-- 
    TOOLTIP use #slot-tooltip and to activate you must have 
    an existing schema prop tooltip too 
  -->
  <template #slot-tooltip="{id, index, obj}"> 
    {{ obj.schema.tooltip }} with value {{ obj.value }}
  </template>

</v-form-base>
PreviousCustom ComponentsNextGeneral

Last updated 4 years ago

Was this helpful?

Example