[Vuejs]-Vuejs3 dynamic attribute with no value

by

1👍

✅

You can bind data vars to attributes just as easily using v-bind: on the attribute (or the shorthand :):

<q-input
  :outlined="outlined"
  :filled="filled"
  v-model="data.value"
  maxlength="12"
  class="super-small subshadow-25"
/>

// script (options api)
data() {
  return {
    item: {
      design: 'filled',
    },
    data: {
      value: null,
    },
  };
},

computed: {
  filled() {
    return this.item.design === 'filled';
  },
  outlined() {
    return this.item.design === 'outlined';
  },
}
👤Erich

Leave a comment