Использование компонентов лезвия и JavaScript

Question

Я использую Laravel и пытаюсь использовать javascript для заполнения списка пользователей. Проблема в том, что каждая запись списка основана на представлении, которое я сделал в компоненте Blade:

pro_list_entry.blade.php

@if( isset($pro_id) && isset($pro_avatar) && isset($pro_name))
    <a onclick='selectProfessional( {{ $pro_id }} , {{ $pro_avatar }}, {{ $pro_name }} )' style='cursor: pointer'>
        <div class='row'>
            <div class='col-4'>
                <img class='u-avatar rounded-circle' src='{{ $pro_avatar }}'>
            </div>
            <div class='col-8 d-flex align-items-center'>
                <h6 class='fm-wrapped-text'>{{ $pro_name }}</h6>
            </div>
        </div>
    </a>
 @endisset

Тогда я бы хотел добавить все эти компоненты в список, используя Javascript:

var listOfPhysicians = buildProfessionalListFromData(jsonData.professionals);

$('#pc_new_app_med_list').empty();
$('#pc_new_app_med_list').html(listOfPhysicians);

...

function buildProfessionalListFromData(data) {
    var list = "";

    if (data != null) {
        for (i = 0; i < data.length; i++) {

            var entry =
            "@component('patrons.clinic.shared.pro_list_entry')"
                + "@slot('pro_id')" + data[i].professional_id + "@endslot"
                + "@slot('pro_avatar') ../../user_uploads/avatars/" + data[i].avatar + "@endslot"
                + "@slot('pro_name')" + data[i].prefix + " " + data[i].first_name + " " + data[i].last_name + "@endslot"
            + "@endcomponent";

            list = list + entry;
        }
    }
    return list;
}

После небольшого исследования я обнаружил, что то, что я пытаюсь сделать, просто невозможно.

Есть ли другой способ сделать это? Добавление записей списка, основанных на представлении, и заполнение их данных с помощью javascript? Может быть, я просто не вижу очевидного решения.

Любая помощь?

Спасибо.

Answer 1

Вы можете написать свой клинок как обычно, как обычно, и визуализировать его, используя функцию render().

В вашем методе контроллера

 function foo()
 {
    $yourView= SELF::returnYourView();
    return json_encode(['yourView' => $yourView]);
 }

functionv returnYourView()
{
    return view('yourview')->render();
}

В вашем jquery

$('your-parent-dev').html(response.yourview);