vue指令-v-on

vue指令-v-on

    • 1、语法
    • 2、示例

1、语法

v-on:事件名=“执行的少量代码”
v-on:事件名=“methods中的函数名”
v-on:事件名=“methods中的函数名(实参)”

2、示例

<template>
  <div id="app">

    <p>你要购买商品的数量:{{ count }}</p>
    <button v-on:click="count+=1">+1</button>
    <button v-on:click="addFn">+11</button>
    <button @click="addCountFn(9)">+5</button>
    
  </div>
</template>

<script>


export default {
  data(){
    return {
      count: 1,
    }
  },
  //定义函数
  methods:{
    addFn(){
      console.log(this)
      this.count++
    },
    addCountFn(num){
      this.count+=num
    }
  }
  
}
</script>

你可能感兴趣的:(#,vue指令,vue.js,前端,javascript)