I have below the draft implementation. The spec is to show the parent information and children-grandchildren information.
@foreach ($parent as $children)
<x-icons.chevron-right>
<h1>{{ $parent->name }}</h1>
@if($person->has('children'))
// go back at the top for nested for each
@endif
@endforeach
One solution that you may recommend is to create an iterative function. But my problem for that, it does not completely render my component-icon chevron-right
.
@php
function showHTML($person) {
$html = '';
foreach($person as $children) {
$html .= `
<x-icons.chevron-right>
<h1>$person->name</h1>
`;
if ($person->has('children')) {
$html .= showHTML($person->children);
}
}
return $html;
}
@endphp
{!! showHTML($person) !!}
Just wondering if you guys have other solution for this to show nested with a component icon? I would appreciate any answer.
2
Answers
You can try
=> value
on your foreach, that will fetch data array value from backend.Or can you show your code on backend (controller), that can easy to help you
Simply re-iterate the component if it has a children. In this case, the icon will be rendered properly.
So my usage would like this below:
And my root component
parent.blade.php
. So If there is person has children I just re-iterate the component and pass his children as a prop: