solution: @save="updateField(props.row)"

Still not perfect. How can I pass an information about a row in datatable? @Save has only old and new value. But I need to update a row in a table.

Solution is simple. If I read the documentation not only for table but also for popup edit:

 <q-popup-edit @save="updateFiled" buttons v-model="props.row.FIELD_TO_CHANGE">
   <q-field>
         <q-input v-model="props.row.FIELD_TO_CHANGE"/>
    </q-field>
</q-popup-edit>

I’d like to send a changed value from edited column to a database only if QInput field in QTable is changed. But v-model is updated with every input change - doesn’t matter if I use property to show SET and CANCEL buttons for QInput.

How should I send a changed value to database only if the field is changed (editted field is submited with enter or with SET if buttons are visible)?

 <q-popup-edit v-model="props.row.FIELD_TO_CHANGE">
      <q-field>
              <q-input v-model="props.row.FIELD_TO_CHANGE" />
       </q-field>
 </q-popup-edit>

I tried .lazy with v-model but it has no influence.

I’m struggling with the same problem whenever I publish a new versions of our apps to the Intranet but I haven’t find a way how to force Webpack change hash => change all file names to let the browser (Chrome, IE11) know that there is a new version.

this.$nextTick did the trick to solve IE11 issue.

<q-tooltip v-show="isRendered" :offset="[0,15]">{{course.ZKRATKA}} - ID: {{course.ID}}</q-tooltip>

mounted () {
      this.$nextTick(function () {
        this.isRendered = true
      })
    }

Recommended source with cheatsheets is also great and not only for Vue Js.

Thanks a lot for your advice!

I have a page with own table. When the page is loaded in Chrome rendering speed and UI experience is as expected but if IE11 is used tooltips are visible before the complete page is rendered.
Once the page is ready to use q-toooltips disappears and are working as expected (onmouseover). I’ve tried to wrap them into v-if and use timeout but all tooltips appears for a while again at the end of rendering.

IE11 - before the page is user responsive- rendering:

IE11 - page is ready to use:

Any idea for workaround or code changes?

 <div class="column z-col col z-align-right gt-sm" style="min-width:66px">
          <span v-if="course.STUDENTI_POCET_PLAN!==course.STUDENTI.length">
            {{course.STUDENTI_POCET_PLAN}}/
            <span style="color:red">{{course.STUDENTI.length}}
              <q-tooltip>planned students &#8800; entered students</q-tooltip>
            </span>
          </span>
          <span v-if="course.STUDENTI_POCET_PLAN===course.STUDENTI.length">
            {{course.STUDENTI_POCET_PLAN}}/{{course.STUDENTI.length}}
          </span>
        </div>

After three days of trying to find a way how to force webpack load .js file and not to compile it I gave up. Back to axios and json.

I’d like to store my application settings in zSettings.js file which would stay readable after building an application.

I use static folder but I have a feeling that export default in combination with import always transpile my zSettings.js, so even I change the content it has no influance on application.

// statics/zSettings.js
const zSettings = {
  "API": "localhost"

export default zSettings

In my .vue component:

import zSettings from "../statics/zSettings.js" // editable settings file

Could you help me how to treat custom settings inside .js files or should I keep my settings as .json (where I can not store my comments) and use Webpack with fs to copy it into statics?

Additional info: Documentation says that “files in static/ are not processed by Webpack at all” but I found out that all my files are processed and compiled (.js files) into webpack files into dist/js folder and copied to statics but settings are used from compiled dist/js folder.