CODEWITHSUNDEEP
javascriptphplaravelvue.js
Konrad Uciechowski
Konrad Uciechowski

Reputation: 486

Laravel 4.2 Vuejs

I am working in laravel 4.2 and I want to implement Vue.js into my application. When I put some testing code in my blade it only shows error that "Use of undefined constant message - assumed 'message'"I know that laravel read {{message}} like php code but do you know any solution how to add vue.js to my blade? Thanks for help. Here is code

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.4/vue.js"></script>
<script>
new Vue({
    el: '#app',
    data: {
        message: 'hello from Vue.js 2.0'
    }
})
</script>
<div id="app">
<p>{{ message }}</p>
</div>

Upvotes: 0

Views: 680

Answers (2)

Yashvantsinh Zala
Yashvantsinh Zala

Reputation: 531

You can add @ before print message veriable

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.4/vue.js"></script>
    <script>
        $(document).ready(function () {
            new Vue({
                el: '#app',
                data: {
                    message: 'hello from Vue.js 2.0'
                }
            })
        });
    </script>
    <div id="app">
        <p>@{{ message }}</p>
    </div>

Upvotes: 4

Vamsi Krishna
Vamsi Krishna

Reputation: 31352

escape the code using @ 

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.4/vue.js"></script>
<script>
new Vue({
    el: '#app',
    data: {
        message: 'hello from Vue.js 2.0'
    }
})
</script>
<div id="app">
<p>@{{ message }}</p>
</div>

See Displaying Raw Text With Curly Braces section here

Upvotes: 1

Related Questions