Optimizing your App and Using Components to Display Data Chapter 3}
let increasing = false,
balance = this.person.balance / 1000;
if(Math.round(balance) == Math.ceil(balance))
{
increasing = 'increasing';
}
return [balanceLevel, increasing];
},
/**
* Fields
*/
balance() {
return this.currency +
this.person.balance.toFixed(2);
},
dateRegistered() {
let registered = new
Date(this.person.registered);
return registered.toLocaleString('en-US');
},
status() {
return (this.person.isActive)? 'Active' :
'Inactive';
}
}
});And our team-member-template should look fairly simple in comparison to what it did
look like:
<script type="text/x-template" id="team-member-
template">
<tr v-show="filterRow()">
<td>
{{ person.name }}
</td>
<td>
<a v-bind:href="'mailto:' + person.email">{{
person.email }}</a>
</td>
<td v-bind:class="balanceClass">
{{ balance }}
</td>
<td>
{{ dateRegistered }}
</td>
<td v-bind:class="activeClass">