Passing a custom event in a Laravel Blade View Announcing the arrival of Valued Associate #679: Cesar Manara Planned maintenance scheduled April 23, 2019 at 23:30 UTC (7:30pm US/Eastern) Data science time! April 2019 and salary with experience The Ask Question Wizard is Live!How to Set Variables in a Laravel Blade TemplateHow to Get the Current URL Inside @if Statement (Blade) in Laravel 4?Best Practices for Custom Helpers in Laravel 5Laravel 5: Display HTML with BladeLaravel - Pass object through view and use in bladeHow to pass a custom function to a Laravel Blade template?Load empty value from model to Label in Laravel 5 Blade templatePassing data from Laravel Blade to Vue componentLaravel Blade - custom helperReplacing laravel blade with vue
2 sample t test for sample sizes - 30,000 and 150,000
When speaking, how do you change your mind mid-sentence?
What is the definining line between a helicopter and a drone a person can ride in?
Is "ein Herz wie das meine" an antiquated or colloquial use of the possesive pronoun?
Can 'non' with gerundive mean both lack of obligation and negative obligation?
Pointing to problems without suggesting solutions
How is an IPA symbol that lacks a name (e.g. ɲ) called?
Can this water damage be explained by lack of gutters and grading issues?
/bin/ls sorts differently than just ls
Can I take recommendation from someone I met at a conference?
Why does my GNOME settings mention "Moto C Plus"?
Short story about an alien named Ushtu(?) coming from a future Earth, when ours was destroyed by a nuclear explosion
What's the connection between Mr. Nancy and fried chicken?
Like totally amazing interchangeable sister outfit accessory swapping or whatever
“Since the train was delayed for more than an hour, passengers were given a full refund.” – Why is there no article before “passengers”?
Trying to enter the Fox's den
Who's this lady in the war room?
Import keychain to clean macOS install?
Married in secret, can marital status in passport be changed at a later date?
Why does BitLocker not use RSA?
Alternative to "rest in peace" (RIP)
Are there any AGPL-style licences that require source code modifications to be public?
Is there a way to convert Wolfram Language expression to string?
Does using the inspiration rules for character defects tend to encourage players to display MGS?
Passing a custom event in a Laravel Blade View
Announcing the arrival of Valued Associate #679: Cesar Manara
Planned maintenance scheduled April 23, 2019 at 23:30 UTC (7:30pm US/Eastern)
Data science time! April 2019 and salary with experience
The Ask Question Wizard is Live!How to Set Variables in a Laravel Blade TemplateHow to Get the Current URL Inside @if Statement (Blade) in Laravel 4?Best Practices for Custom Helpers in Laravel 5Laravel 5: Display HTML with BladeLaravel - Pass object through view and use in bladeHow to pass a custom function to a Laravel Blade template?Load empty value from model to Label in Laravel 5 Blade templatePassing data from Laravel Blade to Vue componentLaravel Blade - custom helperReplacing laravel blade with vue
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty height:90px;width:728px;box-sizing:border-box;
I have a PHP blade file and I have a list of components working as they but can't seem to pass in a custom event in the kebab style casing the documentation mentions .
Blade template
<div id="app">
<Shop
:active-tab="activeTab"
@show-product-modal="handleShowProductModal"
>
</Shop>
</div>
Even the @show-product-modal color syntax in my text editor shows something is off but I can't tell what the issue is here. I've even tried camel casing it but that doesn't do it either. However, if i changed it to 1 word , like "@showitnow", it works fine.
laravel vue.js laravel-blade
add a comment |
I have a PHP blade file and I have a list of components working as they but can't seem to pass in a custom event in the kebab style casing the documentation mentions .
Blade template
<div id="app">
<Shop
:active-tab="activeTab"
@show-product-modal="handleShowProductModal"
>
</Shop>
</div>
Even the @show-product-modal color syntax in my text editor shows something is off but I can't tell what the issue is here. I've even tried camel casing it but that doesn't do it either. However, if i changed it to 1 word , like "@showitnow", it works fine.
laravel vue.js laravel-blade
Please can you show the code where you're emitting the event?
– Ross Wilson
Mar 22 at 14:51
add a comment |
I have a PHP blade file and I have a list of components working as they but can't seem to pass in a custom event in the kebab style casing the documentation mentions .
Blade template
<div id="app">
<Shop
:active-tab="activeTab"
@show-product-modal="handleShowProductModal"
>
</Shop>
</div>
Even the @show-product-modal color syntax in my text editor shows something is off but I can't tell what the issue is here. I've even tried camel casing it but that doesn't do it either. However, if i changed it to 1 word , like "@showitnow", it works fine.
laravel vue.js laravel-blade
I have a PHP blade file and I have a list of components working as they but can't seem to pass in a custom event in the kebab style casing the documentation mentions .
Blade template
<div id="app">
<Shop
:active-tab="activeTab"
@show-product-modal="handleShowProductModal"
>
</Shop>
</div>
Even the @show-product-modal color syntax in my text editor shows something is off but I can't tell what the issue is here. I've even tried camel casing it but that doesn't do it either. However, if i changed it to 1 word , like "@showitnow", it works fine.
laravel vue.js laravel-blade
laravel vue.js laravel-blade
edited Mar 22 at 14:07
jjoan
asked Mar 22 at 14:00
jjoanjjoan
687
687
Please can you show the code where you're emitting the event?
– Ross Wilson
Mar 22 at 14:51
add a comment |
Please can you show the code where you're emitting the event?
– Ross Wilson
Mar 22 at 14:51
Please can you show the code where you're emitting the event?
– Ross Wilson
Mar 22 at 14:51
Please can you show the code where you're emitting the event?
– Ross Wilson
Mar 22 at 14:51
add a comment |
1 Answer
1
active
oldest
votes
When using VueJS you can't use kebab case for listening to component events. Instead your blade template should read:
<div id="app">
<Shop
:active-tab="activeTab"
@showProductModal="handleShowProductModal"
>
</Shop>
</div>
It's the other way round. You get a warning if you use camelcase in html as html is case insensitive. Also, you can use either if you're using.vuefiles :)
– Ross Wilson
Mar 22 at 14:51
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55301282%2fpassing-a-custom-event-in-a-laravel-blade-view%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
When using VueJS you can't use kebab case for listening to component events. Instead your blade template should read:
<div id="app">
<Shop
:active-tab="activeTab"
@showProductModal="handleShowProductModal"
>
</Shop>
</div>
It's the other way round. You get a warning if you use camelcase in html as html is case insensitive. Also, you can use either if you're using.vuefiles :)
– Ross Wilson
Mar 22 at 14:51
add a comment |
When using VueJS you can't use kebab case for listening to component events. Instead your blade template should read:
<div id="app">
<Shop
:active-tab="activeTab"
@showProductModal="handleShowProductModal"
>
</Shop>
</div>
It's the other way round. You get a warning if you use camelcase in html as html is case insensitive. Also, you can use either if you're using.vuefiles :)
– Ross Wilson
Mar 22 at 14:51
add a comment |
When using VueJS you can't use kebab case for listening to component events. Instead your blade template should read:
<div id="app">
<Shop
:active-tab="activeTab"
@showProductModal="handleShowProductModal"
>
</Shop>
</div>
When using VueJS you can't use kebab case for listening to component events. Instead your blade template should read:
<div id="app">
<Shop
:active-tab="activeTab"
@showProductModal="handleShowProductModal"
>
</Shop>
</div>
answered Mar 22 at 14:33
George HansonGeorge Hanson
1,379113
1,379113
It's the other way round. You get a warning if you use camelcase in html as html is case insensitive. Also, you can use either if you're using.vuefiles :)
– Ross Wilson
Mar 22 at 14:51
add a comment |
It's the other way round. You get a warning if you use camelcase in html as html is case insensitive. Also, you can use either if you're using.vuefiles :)
– Ross Wilson
Mar 22 at 14:51
It's the other way round. You get a warning if you use camelcase in html as html is case insensitive. Also, you can use either if you're using
.vue files :)– Ross Wilson
Mar 22 at 14:51
It's the other way round. You get a warning if you use camelcase in html as html is case insensitive. Also, you can use either if you're using
.vue files :)– Ross Wilson
Mar 22 at 14:51
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55301282%2fpassing-a-custom-event-in-a-laravel-blade-view%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Please can you show the code where you're emitting the event?
– Ross Wilson
Mar 22 at 14:51