“Vue v-on 补充”的版本间的差异

来自姬鸿昌的知识库
跳到导航 跳到搜索
第2行: 第2行:
  
 
传递自定义参数,事件修饰符
 
传递自定义参数,事件修饰符
 +
 +
=== 形式1 ===
 +
<syntaxhighlight lang="html">
 +
<div id="app">
 +
    <input type="button" @click="doIt"/>
 +
</div>
 +
</syntaxhighlight><syntaxhighlight lang="javascript">
 +
var app = new Vue({
 +
    el:"#app",
 +
    methods:{
 +
        doIt:function(){}
 +
    }
 +
})
 +
</syntaxhighlight>
 +
 +
=== 形式2 ===
 +
<syntaxhighlight lang="html">
 +
<div>
 +
    <input type="button" @click="doIt(p1)"/>
 +
</div>
 +
</syntaxhighlight><syntaxhighlight lang="javascript">
 +
var app = new Vue({
 +
    el:"#app",
 +
    methods:{
 +
        doIt:function(p1){}
 +
    }
 +
})
 +
</syntaxhighlight>

2023年8月8日 (二) 07:25的版本

https://www.bilibili.com/video/BV12J411m7MG/?p=16

传递自定义参数,事件修饰符

形式1

<div id="app">
    <input type="button" @click="doIt"/>
</div>
var app = new Vue({
    el:"#app",
    methods:{
        doIt:function(){}
    }
})

形式2

<div>
    <input type="button" @click="doIt(p1)"/>
</div>
var app = new Vue({
    el:"#app",
    methods:{
        doIt:function(p1){}
    }
})