vue-methods三种调用的形势



    

        var btn = {
            template:`<button>组件add</button>`
        }

       var any = new Vue({
         el: '#app',
         data:{
            a:1
         },
        
        components: {
            btn
        },
        methods:{
            add:function(num){
                if(num != ''){
                    this.a+=num
                }else{
                    this.a++;
                }
            }
        }
         
       })
    

  1. 第一种最简单的--在vue实例中调用
    <div id="app">
       {{ a }}
       <p><button @click="add(2)">add</button></p>        //第一种方式
       <p><btn @click.native="add(2)"></btn></p>       //第二种方式
    </div>
    <button onclick="any.add(2)">add++</button>     //第三种方式

在Vue当前组件中直接调用add @click="add(2)"直接绑定就可以了

在子组件中调用父组件的方法 @click.native="add(2)" 需要调用加上事件修饰符

在vue实例外面,直接以原生的方式调用组件中的方法
onclick="any.add(2)" 需要通过组件. 方法名的形势调用


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM