How to insert a Tooltip into an input field

The user of my system, uses notebook and the inputs, not of a form but of filter, do not appear 100% on his screen, but it is normal, it is responsive to a certain extent the project that I took already walking.

Good: how to insert Tooltip into fields of type input and select using Vue.js with Quasar Framework.

In buttons is simple, just use: 

<q-btn label="Hover me" color="primary">
          <q-tooltip>
            Some text as content of Tooltip
          </q-tooltip>
        </q-btn>

Based on this example: https://codepen.io/pen/?&editable=true&editors=101

But not I saw how to do in Input or Select. I've tried the same button shape but I can't.

PS: inputs and selects are from filters and already come with default data. The user wants to hover the mouse over and see what it is when the screen is smaller.

The screen in normal size:

insert the description of the image here

A non-customer fabric:

insert the description of the image here

I know it's freshness, but customer is customer....

Thank you!

Author: Ramos, 2019-09-23
Source

1 answers

Guy I tested here and it worked. I believe it is not necessary but first check if vc included Tootltip Component (components: ['QTooltip']) in quasar.conf.js

I have this result

insert the description of the image here

The structure I put together here is this 

    <q-input outline dense debounce="300" v-model="filter" placeholder="Pesquisar">
        <q-tooltip
            anchor="center middle"
            self="center middle"
        >Clique para editar
    </q-input>
 1
Author: hugocsl, 2019-09-23 16:55:02