V-model - not possible to set it dynamical?

Unfotunately I cannot find a working example, to get a proper v-model setting
for my < q-input >

         <q-td v-for="col in props.cols" :key="col.name" :props="props">
            {{ col.value }}

               v-model="db_user"   // this works  i.e.
              v-model="col.name"   // this NOT although,   col.name === db_user    i.e.

               v-model="db_user"   // this works i.e
              v-model="col.name"   // this NOT, although   col.name === db_user    i.e.
                :counter="col.type == 'text' ? true : false"

I got all my setters and getters computed here:

computed: {

What I’m doing wrong? Or isn’t it possibel to do this ? Thx.

A bit of hoop-jumping may be required:

computed: {
  vm () {
    return this
  // ...



As you can’t use this directly in a template I’ve given it an alias of vm. No particular reason it has to be in computed, it could be in data if you prefer.

Completely unrelated:

:counter="col.type == 'text' ? true : false"
  1. Avoid double equals.
  2. Ditch the ternary, you’ve already got a boolean true/false value from the comparison.
:counter="col.type === 'text'

@skirtle Thanks! With that , it works (somehow).
Again unfortunately: counter is set, but it never counts :unamused:
And: How could I post initial value when q-popup-edit arises?
I tried with "@show " event but I wasn’t able to set “col.value” as initial value.

Finally found a way to mange this. Maybe it could help others.

    v-for="col in props.cols"
        :props="props"  >
            {{ col.value }}
          v-if="col.name !== 'Idx' && col.name !== 'TS'"
          @input="v => (vm[col.name] = v)"
          @save="(v, i) => updateCell(v, i)"
          @before-show="() => cpRow(props.row)"
           buttons >
                :counter="col.type !== 'number'"
                autofocus  />

and this methods:

  methods: {
    cpRow (row) {
      this.$store.commit("accounts/copyRow2Model", row)
    updateCell (v, i) {
      this.$store.dispatch("accounts/updateRow", this,i);

and my state:

export default function() {
  return {
    accList: [],
    accModel: {
      active: 0,
      domain: "",
      db_server: "",
      db_user: "",
      mediaQuota: 0,

Didn’t thought, that it would that be complicated. But okay, Vue it’s reactive and this way is rather new to me (former ExtJS for many yrs)