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

来自姬鸿昌的知识库
跳到导航 跳到搜索
第20行： 第20行：
 
<syntaxhighlight lang="html">
 
<syntaxhighlight lang="html">
 
<div>
 
<div>
−
     <input type="button" @click="doIt(p1)"/>
+
     <input type="button" @click="doIt(p1, p2)"/>
 +
    <input type="text" @keyup="sayHi">
 +
    <input type="text" @keyup.enter="sayHi">
 
</div>
 
</div>
 
</syntaxhighlight><syntaxhighlight lang="javascript">
 
</syntaxhighlight><syntaxhighlight lang="javascript">
第26行： 第28行：
 
     el:"#app",
 
     el:"#app",
 
     methods:{
 
     methods:{
−
         doIt:function(p1){}
+
         doIt:function(p1, p2){},
 +
        sayHi:function(){}
 
     }
 
     }
 
})
 
})
 
</syntaxhighlight>
 
</syntaxhighlight>

2023年8月8日 (二) 08:00的版本

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, p2)"/>
    <input type="text" @keyup="sayHi">
    <input type="text" @keyup.enter="sayHi">
</div>

var app = new Vue({
    el:"#app",
    methods:{
        doIt:function(p1, p2){},
        sayHi:function(){}
    }
})
取自“https://www.jihongchang.top/index.php?title=Vue_v-on_补充&oldid=7045”