Problems with curly braces

What seems to be the problem:

Sometimes, when displaying data (after a Livewire request), the template doesn’t display data.

Steps to Reproduce:

It’s periodic. I haven’t been able to figure out what the cause is. However, this is what my template looks like:

<a href="{{ route('user.edit', ['user' => $user->id]) }}">
    @if($user->is_paid_user)
        <span title="Paid user">&#x2605;</span>
    @endif
    @if($user->paid_user_override)
        <i title="Paid user override" class="fa fa-bolt" aria-hidden="true"></i>
    @endif

    [{{ $user->display_name }}]
    <br/>
    <em>{{$user->email}}</em>
    <br/>
</a>

In the above, periodically, the display_name won’t show. Again, sometimes it works. Other times it does not. See those [] just around the curly braces? Those don’t display either.

Are you using the latest version of Livewire:

I think so. I just installed it on a Laravel 8 install a couple of days ago.

Do you have any screenshots or code examples:

Here is an example:

(1) shows it not working as mentioned.
(2) Shows it actually is working (somehow?)
(3) Shows it not working again.

What’s also odd is that inside of the Livewire request, the data exists.

(You’ll have to trust me, I tried to upload a photo but it would only let me add one.) So appears to be some sort of replacement issue.

What is also strange is that if I wrap the [{{ $user->display_name }}] with <span></span>… the problem appears to go away completely and no more rendering issues occur.

Hi,
Can you try {{ '['.$user->display_name.']' }} i think that is a problem when parsing the file, blade engine is confusing that expression with an array.

The [ and ] wrappings don’t make a difference. It doesn’t work even if they removed.

Also, I wanted to clarify:

What’s also odd is that inside of the Livewire request, the data exists .

When I look at the request payload coming back from the server, the blade template is correctly rendered in the response, but it just doesn’t appear to make it into the browser properly.

Is that part wrap with a div? i mean the hole component wrap within a div, Livewire use div to keep track of dom changes, if you don’t do that, things starts disappearing.

Yes, the whole component is wrapped with a div. I was scratching my head for 20 minutes before this issue because of that! :rofl:

1 Like

Is you can show your component code that can help to understand what’s happening

Check out the troubleshooting section of the Docs, specifically the top bit about Dom Diffing Issues. If your response has the correct data but the view isn’t updating Livewire is struggling to find a difference and therefore not updating the DOM.

Interesting. I’ll have to try wire:key to see if that helps. For now, it’s working but it’s strange that adding <span> makes it work.