VueJS pass multiple value on function with v-on:click

In this Post We Will Explain About is VueJS pass multiple value on function with v-on:click With Example and Demo.Welcome on Pakainfo.com – Examples, The best For Learn web development Tutorials,Demo with Example! Hi Dear Friends here u can know to vue.js – Pass selected value to vuejs function Example

In this post we will show you Best way to implement Methods and Event Handling – vue.js, hear for VueJS pass value to v-on:click function inside v-for with Download .we will give you demo,Source Code and examples for implement Step By Step Good Luck!.

VueJS Methods in Inline Handlers

index.html

<div id="liveExample-3">
  <button v-on:click="getArg('jaydeep')">Say hi</button>
  <button v-on:click="getArg('Pakainfo.com')">Say what</button>
</div>

index.js

new Vue({
  el: '#liveExample-3',
  methods: {
    getArg: function (message) {
      alert(message)
    }
  }
})

VueJS Event Modifiers

There are the following list of the VueJS Event Modifiers.

• .stop
• .prevent
• .capture
• .self
• .once

.stop – VueJS Event Modifiers

the click event’s simple propagation will be methods stopped

<a v-on:click.stop="doThis"></a>

submit – VueJS Event Modifiers

the submit main event will no any type longer data reload the page

<form v-on:submit.prevent="onSubmit"></form>

.stop – VueJS Event Modifiers

modifiers may be cycle means chained

<a v-on:click.stop.prevent="getThat"></a>

.self – VueJS Event Modifiers

just simple it self the modifier

<div v-on:click.self="getThat">...</div>

.capture – VueJS Event Modifiers

use this event capture mode when putting the event listener

<div v-on:click.capture="getIncents">.....some source code....</div>

VueJS Key Modifiers

• .enter
• .tab
• .up
• .down
• .left
• .right
• .delete
• .esc
• .space

Passing event and argument to v-on in Vue.js

<input type="number" v-on:input="addToStudent($event, num)" min="0" placeholder="0">

How to call multiple function with v-on:click

<div id="liveApp">
        <div @click="mainhandle('jaydeep','Gondaliya')">
            Welcome, click me!
        </div>
    </div>

<!--Pakainfo.com link to vue.js !--> 
<script src="vue.js"></script>

<script>
   (function(){
        var vm = new Vue({
            el:'#liveApp',
            methods:{
                firstMethod:function(param){
                    console.log('firstMethod: ',param);
                },
                SecondMethod:function(param){
                    console.log('SecondMethod: ',param);
                },
                mainhandle:function(param1,param2){
                    this.firstMethod(param1);
                    this.SecondMethod(param2);
                }
            }
        })
    }()); 
</script>

VueJS pass value to v-on:click function

You are Most welcome in my youtube Channel Please subscribe my channel. and give me FeedBack.
More Details……
Angularjs Example

Example

I hope you have Got What is VueJS pass value to v-on:click function And how it works.I would Like to have FeedBack From My Blog(Pakainfo.com) readers.Your Valuable FeedBack,Any Question,or any Comments about This Article(Pakainfo.com) Are Most Always Welcome.