Laravel with vuejs v-on not calling method

Question

Im following Jeffery's vue-series to learn how to impelement vue.js into my projects. Im understanding the basics however Im having a problem with the v-on attribute. For some reason I can't get any of my methods to run on blur click or whatever. Jeffery is using the "" brackets in the video yet in the documentation they use it without. I've tried both and couldn't even get it to log on the console. Here is my setup.

HTML:

<div id = "demo" class = "container">

    <ul>
        <li v-for = "name in names">@{{ name }}</li>
    </ul>

    <input type="text" placeholder="Add new name" v-model = "newName" v-on="blur:addName">

</div>

vue.js

new Vue({

    el: '#demo',

    data: {
        names: ['Ricki', 'Kevin', "James"]
    },


    methods: {

        addName: function() {

            console.log('working');

        }
    }


});

Ogie · Accepted Answer · 2016-02-27 19:37:27Z

3

The v-on syntax has changed. Try this instead

<input type="text" placeholder="Add new name" v-model = "newName" v-on:blur="addName">

answered Feb 27, 2016 at 19:37

Ogie

1,3322 gold badges14 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Ricki Moore Over a year ago

You're right. I was watching the old lessons. He has come out with a updated videos, Thank you!

Collectives™ on Stack Overflow

Laravel with vuejs v-on not calling method

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related