Skip to content
Advertisement

Use blade value inside a component

At the moment I can successfully display some generated content in my blade view by calling a variable with a key, like this:

JavaScript

What I would like to achieve, is to reuse the key for a class name for example. The reason for that is that I want to easily access this content with JavaScript by using a selector. Something that would look like this:

JavaScript

This code work, but as I have many fields, I would like to avoid duplicating the key. To achieve that, I thought of creating a blade components, and pass the key in the slot. So that I can reuse this key both in the class name, and in the placeholder for data. But it seems that my variable {{ $data }} is not accessible from my component file, as it throws the error: $data is undefined.

Here is my code:

JavaScript
JavaScript

I am not familiar to Blade so I am open to another approach if necessary.

Advertisement

Answer

You should pass your data and key as arguments to your component, thereby being more explicit. You don’t need to use a slot for this, as a slot is generally used for blocks of text or HTML, not for simple attributes.

Create your component like this,

JavaScript

And then render it like this

JavaScript
User contributions licensed under: CC BY-SA
6 People found this is helpful
Advertisement