Вуэйс использует foreach в вычисляемом свойстве.Шаблон лезвия

Question

Я - разработчик PHP и обладаю базовыми знаниями о js и vuejs, извините, если это выглядит слишком глупо.Я строю очень сложный реактивный финансовый калькулятор.PS Я работаю над Laravel (шаблоны блейдов) и извлекаю данные в vue, используя blade @foreach()

Моя проблема - вычисляемое свойство.Мне нужно найти одно значение из очень сложной математической формулы (в приведенном ниже коде показана небольшая часть всей идеи. В моей вычисленной функции cashDivideds() мне нужно сделать несколько математических вычислений, чтобы найти значение для каждого объекта в массиве. Я использую этот способ: @foreach($preferredEquities as $equities). После всех вычислений я получаю вывод с правильным значением, но только для 1-го $equity в базе данных.

Вопросы: Как SUM мои вычисленные значения из каждого $equity.

Ниже моего кода, надеюсь, достаточно информации, чтобы понять мою проблему.

new Vue({
    el: "#waterfall",
    data: {
        form: {
            exit_value: 0,
            exit_date: moment(),
            uncovered_debt: 0,
            transaction_fees: 0,
            remaining_exit: "",
        },
    },
    computed: {
        remainingExit () {
            return this.form.exit_value - this.form.uncovered_debt - this.form.transaction_fees
        },
        cashDividends() {

            @foreach($preferredEquities as $equity)
                @if($equity->dividends == false)
                    return  0
                @elseif($equity->dividends == true && $equity->dividend_type == 'equity')
                    return 0
                @elseif($equity->dividends == true && $equity->dividend_type == 'cash' && $equity->compounding == false)
                    var exit_date = this.form.exit_date;
                    var creation_date = moment("{{ $equity->creation_date }}");
                    //Date Difference: days
                    var days_difference = creation_date.diff(exit_date,'days');
                    var days_difference = Math.abs(days_difference);

                    // Accrual Frequency Percentage
                    var daily = (days_difference / 365) * {{ $equity->dividend_percent }};

                    //Total Cash Dividend
                    @if($equity->dividend_frequency == "Daily")
                        var cash_dividend = daily * ({{ $equity->share_price * $equity->shares_authorized }});
                    @endif
            @endforeach

            OUTPUT: need to return sum of cash_dividend for each $equity. Need help with this part
        } 
    }
});

Answer 1

Я бы удалил логику из шаблона блейда и сделал бы это где-нибудь еще, может быть, в контроллере или в каком-либо сервисе (в зависимости от того, как вы строите приложение).Затем просто передайте переменную со значением в шаблон блэйда.Это означает, что ваш шаблон легче для понимания и менее загадочным.Попав в переменную в шаблоне, вы можете просто вывести ее как значение в JavaScript.

Answer 2

• Сначала сохраните ваш php-массив в переменной / массиве из ваших данных / состояния в подключенном () хуке ..

  mounted() {
   this.dataToWork = {!! $preferredEquities !!}
  }
  

• Работайте сданные, использующие только js, обрабатывающие массив js. не усложняйте использование блейд-функций внутри Vue.