如何使用computed属性绑定数据表中的字段?

时间:2018-05-28 14:50:23

标签: vuejs2 vuetify.js

1)使用computed属性为普通文本字段创建货币掩码。我得到了这个工作。

模板

<v-text-field  :prefix="currency" v-model="initialBalanceFormatted" label="Initial Balance" :disabled="disabled"></v-text-field>

代码

get initialBalanceFormatted(){
    return this.formatAsCurrency(this.loan.initialBalance, 0)
}

set initialBalanceFormatted(newValue: any) {
    this.loan.initialBalance = Number(newValue.replace(/[^0-9\.]/g, ''));
}

2)如何在数据表中的字段中使用computed属性?

模板

<v-data-table v-bind:headers="headerLoanBalance" :items="loan.loanBalances" hide-actions="" :total-items="disableSorting">
    <template slot="items" slot-scope="props">
        <tr>
           <td class="pl-0">
             <v-text-field :prefix="currency" v-model="loanbalance[props.item.value]" :disabled="disabled"></v-text-field>
           </td>
        </tr>
    </template>
</v-data-table>

代码

get loanbalance() {
    return this.formatAsCurrency(props.item.value, 0)
}
set loanbalance(newValue: any) {
    props.item.value = Number(newValue.replace(/[^0-9\.]/g, ''));
}

0 个答案:

没有答案