Почему я не вижу свой GrandTotal в моем представлении?

Question

Я использую Laravel 5.7 & VueJs 2.5.* ...

Я хочу отобразить GrandTotal в моей таблице просмотра, но я не знаю, что я делаю неправильно.

Где я показываю GrandTotal:

<tr v-for="ctInvoice in ctInvoices" :key="ctInvoice.id">
  <td>{{ formatPrice(ctInvoice.ct_invoice_grand_total) }}</td>
</tr>

Мой VueJs data():

data() {
    return {
      ctInvoices: {},
      customers: null,
      form: new Form({
        id: "",
        customer_id: "",
        ct_invoice_no: "",
        ct_invoice_date: "",
        ct_invoice_fares_total: 0,
        ct_invoice_taxes_grand_total: 0,
        ct_invoice_grand_total: 0,

        ctInvoiceItems: [{
          id: "",
          ct_invoice_id: "",
          ct_passenger_name: "",
          ct_fares: 0,
          ct_total_tax_breakup: 0,
          ct_sub_total: 0
        }]
      })
    };

Формат Сумма с этим method():

formatPrice(value) {
  let val = (value / 1).toFixed().replace(".", ".");
  return val.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); //75.674,00
},

Изображение для лучшего понимания:

Вывод одного элемента из ctInvoices массива

ctInvoices: Array [20] 0: Объект create_at: «2018-10-27 15:13:06» ct_Invoice_date: «2018-10-31» ct_Invoice_fares_total: «600,00» ct_Invoice_grand_total: «1000,00» ct_Invoice_grand_total_words: нулевой ct_Invoice_tot_t_t_t_t_t_t_t_t_t_t_t_01030 * 1 ct_invoice_no: "111-222-333" покупатель: объект customer_id: 3 id: 22 updated_at: "2018-10-27 15:13:06"

Answer 1

Вы делаете опечатку, у вас есть свойство с именем ct_Invoice_grand_total в вашем ctInvoice объекте с прописными буквами I , и вы вызываете его с помощью строчных букв i , поэтомуВы должны поставить:

     <tr v-for="ctInvoice in ctInvoices" :key="ctInvoice.id">
       <td>{{ formatPrice(ctInvoice.ct_Invoice_grand_total) }}</td>
     </tr>

Answer 2

Какую ошибку выводит ваша консоль?

В ваших данных вы указываете ctInvoices как объект, разве это не должен быть массив с ctInvoice объектами в нем?

Содержит ли каждое ctInvoice в ctInvoices свойство ct_invoice_grand_total?

Вместо использования функции для форматирования цены, вы можете использовать фильтр с toLocaleString .

Vue.filter('formatNumber', value => {
    let number = parseFloat(value);
    let options = { minimumFractionDigits: 2, style: 'currency', currency: 'EUR' };

    return number.toLocaleString("nl-NL", options);
});