In the below code I am trying to change the value of a v-decorator field paid_amount dynamically. I tried changing the data property payableFee through the attribute initialValue. It works for sometimes, but if I click some other actions buttons like confirmation button (which I don’t show here) and closed the confirmation dialog box, then the dynamic nature of field paid_amount does not work.

I know using v-model will work, but I like to use v-decorator as I have already use it for the validation rules.

So I want to know:

1. If I can use both v-decorator and v-model
2. What is the best way to change the value of a v-decorator field dynamically

I am using Vue2 and ant design 1x.

<a-input-number
placeholder="Amount"
v-decorator="[
  `paid_amount`,
  {
    rules: [
      {
        required: true,
        message: 'Please input an amount!'
      }
    ],
    initialValue: payableFee
  }
]"
/>