I am having a problem passing a property using Vuejs ~1.0 to a child component from a Laravel Blade template. If I pass something in plain text it works just fine, but when I try to pass a js property, array, or object it doesn't work at all. I currently have a blade file with a custom component which looks like this:
<my-component video="#{{ stuff }}"></my-component>
If I leave out the #{{ }} the only thing that will be passed is the string stuff, and if I leave out the #, I obviously get a blade error, but if I use #{{ stuff }}, then all I get is the string {{ stuff }}. I'm obviously missing something, but can't tell where I'm going wrong. Thanks in advance.
Look like I just figured it out, it seems that I was missing the colon before video, so it should have appeared like so:
<my-component :video="stuff"></my-component>
If you are passing a variable to the component, then use:
<my-component :video= "{{ json_encode($stuff) }}" ></my-component>
Don't forget the double quotes or the result would be unpredictable for things like objects.
If you are passing model then do this:
<my-component :video="{{ $stuff->toJson() }}" inline-template></my-component>
Related
For example, I have a link to an other post like this in my template
My post
I want to be able to use the post object within the route helper to use the id.
Is there any syntax for this use case?
Or is there an other way of doing this?
Actually I had similar problems to solve this kind of cases. Your question related with Vue exactly, but the method below you can use for your case as well. Anyway you can't execute JS and PHP at the same time, cuz they're working at different sides. But as I also liked to have all routes with their aliases, I thought this approach.. You can imitate something like this:
Route::get('/', 'PostController#all')->name('all'); // all posts page
Route::get('post', 'PostController#all')->name('all_page'); // THIS IS THE THING (one additional route), WHICH WILL TAKE RESPONSIBILITY ON CASE, WHEN post_id WILL BE EMPTY
Route::get('post/{post_id}', 'PostController#post')->name('post');
This method will allow you to use the 1st and 3rd routes as normally, and as mixed too in the different places on your app like this:
{{ route('post.all') }}
{{ route('post', ['post' => $post_id]) }}
{{ route('post') }}/#{{ post.id }}
In scripts you can implement the approach like this:
let someUrl = "{{ route('post') }}/" + postObj.id;
In the view you can implement the method like this:
My post #{{ post.id }}
Currently, my solution to display an encoded ID is like that:
<p v-text='"Reservation code: "+ #json($orderJson).id'></p> //R. code: wYeyjo6l42
But I would prefer to use it like:
<p>#json($orderJson->id)</p> //but returns: 8 (not encoded)
How can I get the transformed attributes?
p.S. Yes I know it's used for API, but I'm even using it to handle objects to Vue via Blade.
Well, I dug up in the code and found out you can use resolve().
So one solution would be:
<p>Reservation code: {{ $orderJson->resolve()['id'] }}</p>
i want to send authenticate user data to props vue. then i tried this:
:user="{{ Auth::user() }}" but got an errors.
Did you try to convert the user object to JSON
:user="{{ json_encode(Auth::user()) }}"
Actually, there is one tini tiny mistake here! You are using {{ Auth::user() }} which is JSON or Array! If you want to store User's ID in user Attribute, you have to use {{ Auth::user()->id }}.
If you want to Authenticate user first, you can use if Condition! For example,
#if(Auth::user())
// Your Markup Code
#endif
Let me know if it helps!
Use It like this
<post-comment user="{{ Auth::user() }}"></post-comment>
Using : is reserved for data binding for properties from data object aka Vue App Model / State.
I guess you are using this into Laravel Blade.
Dynamic Props - https://v2.vuejs.org/v2/guide/components.html#Dynamic-Props
However your way would works only If Auth::user() method return the Boolean (true/false).Otherwise It would throw an error in Browser Console.
I'm using Silex, and need to alter a Twig file based on the location its loaded from.
My first thought was checking the url, but unfortunately this returns the location of the rendered Twig location, and not the parent url as expected.
{{ path(app.request.attributes.get('_route')) }}
Another attempt was to pass some vars with the render, however I'm not certain how to do this from within Twig (and if it's possible at all).
{{ render(path('cart')) }}
Can someone possible help me with a solution?
Thanks in advance
This is indeed a problem with silex core. I have submitted a pull request that introduces a new renderRoute twig function that should fix the issue. Hopefully it will be merged soon.
Well i didn't get perfectly what are you asking, but if you want to pass variables in render method you can do this:
{% render "ProjectTesteBundle::ControllerName::actionName" with { 'variableNameToPass' : variableValue } %}
if you want get route name in twig template you can do do something like this:
{% set routeName = app.request.attributes.get('_route') %}
I want to pull a url segment variable into the pyrocms file plugin call. it would look like
{{files:listing folder="[segment(2)]"}}
or something of the sort. What is the trick for embedding
{{url:segments..}}
inside
{{files:listing folder="…}}
I am trying to setup this up for a conditional query for a photo gallery
If you take a look at the PyroCMS Tags documentation you will see this clearly documented in the "Tag Attributes" section.
You may also use the output from other tags as attribute values in your tags. For example if you wanted the url segment to default to the slug of the currently viewed page you could do this:
{{ url:segments segment="1" default=page:slug }}
Here is an example showing the proper use of quotes and braces when the tag used as the attribute value has an attribute itself.
{{ url:segments segment="1" default={foo:bar value="baz"} }}
Tip: Omit quotes and braces when using tags as attribute values. The only exception is when the tag you are using as the attribute value has its own attributes.
So you can do that easily with:
{{ files:listing folder={url:segments segment="2"} }}
Basically you don't need to pretend it's a string if it's not. You can just send the foo:bar arguments through, but it if has attributes you can "group" the attributes with the call via a single { and }.
Simple right? :)