Olá eu tenho uma dúvida que já está me consumindo uns dias, eu criei uma Api no laravel, e em outro projeto estou criando o front-end, então eu criei alguns componentes e iniciei eles com uma array para testar.
$data = [
[
'id'=>'10',
'checked'=>true,
'name'=> 'Alexandre Silva',
'collaborator'=> 'Motorista',
'star'=> 5,
'cover'=>'https://images....'
],
]
@foreach($data as $item)
<li id="$item['id']">
<!-- colaborator-rating component-->
<x-card.preform.colaborator-rating
:name="$item['name']"
:collaborator="$item['collaborator']"
:cover="$item['cover']"
:checked="$item['checked']">
<!-- prefabs.ratin component-->
<x-prefabs.rating :starNumber="$item['star']">
<a href="#"
class="text-xs px-1 font-medium text-primary-900 underline hover:no-underline dark:text-white">{{$item['star']}}</a>
<a href="#"
class="text-xs px-1 font-medium text-primary-900 underline hover:no-underline dark:text-white">+{{ $item['id']}}
Viagens </a>
</x-prefabs.rating>
<!-- prefabs.ratin component-->
</x-card.preform.colaborator-rating>
<!-- colaborator-rating component-->
</li>
@endforeach
Agora em um cenário real, eu criei uma rota e um controller para buscar os dados lá da Api e faço essa requisição por este Ajax:
function carregarTabela(url, httpMethod, dados) {
$.ajax({
url: url,
method: httpMethod,
data: dados,
dataType: 'json',
contentType: false,
cache: false,
processData: false,
success: function (response) {
response.data.forEach(
element => $('#minha-lista').append()
);
},
error: function (response) {
}
});
}
como eu posso instanciar o meu componente no elemento #minha-lista, essa seria uma boa abordagem ou tem uma outra forma de trazer esses dados sem refresh?