Joao Pedro
Joao Pedro

Reputation: 33

Vue v-model on a specific prop

I want v-model="num" just when the v-if prop === 'amount'. How can i do it? because the input is common to 'qty' and 'book_value'

<template #item="{ prop, value, rowIndex }">
    <div
    v-if="prop === 'qty' || prop === 'book_value'"
    >
    <input
      v-model="num"
      :value="preview && prop === 'book_value'? formatAmount(value) : value"
      :preview="preview"
       @input="setRuleItem({ newValue: $event, prop, rowIndex, name: 'actions' })"
     />

---------------------------

watch: {
    num (newVal, oldVal) {
      if (newVal.includes('.')) {
        this.$nextTick(() => { this.num = newVal.split('.')[0] + '.' + newVal.split('.')[1].slice(0, 2) })
      }
    }
  },

Upvotes: 0

Views: 69

Answers (1)

MohKoma
MohKoma

Reputation: 1452

You can do it in many ways, but here are some simple examples

Use input handler instead of v-model

<input @input="(val) => prop === 'amount' ? num = val : false" :value ... />

create another element

<input v-if="prop === amount" v-model="num"...><input v-else :value... ></input>

Upvotes: 1

Related Questions