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)" 需要通过组件. 方法名的形势调用

vue-methods三种调用的形势的更多相关文章

  1. Vue组件的三种调用方式

    最近在写fj-service-system的时候,遇到了一些问题.那就是我有些组件,比如Dialog.Message这样的组件,是引入三方组件库,比如element-ui这样的,还是自己实现一个?虽然 ...

  2. 小白学习VUE第一篇文章---如何看懂网上搜索到的VUE代码或文章---使用VUE的三种模式:

    小白学习VUE第一篇文章---如何看懂网上搜索到的VUE代码或文章---使用VUE的三种模式: 直接引用VUE; 将vue.js下载到本地后本目录下使用; 安装Node环境下使用; ant-desig ...

  3. vue.js 三种方式安装

    Vue.js(读音 /vjuː/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.它不仅易于上手 ...

  4. 【转】SVG与HTML、JavaScript的三种调用方式

    原文:https://www.cnblogs.com/guohu/p/5085045.html SVG与HTML.JavaScript的三种调用方式 一.在HTMl中访问SVG的DOM 1 2 3 4 ...

  5. vue.js 三种方式安装--npm安装

    Vue.js是一个构建数据驱动的 web 界面的渐进式框架.     Vue.js 的目标是通过简单的 API 实现响应的数据绑定和组合的视图组件.它不仅易上手,便于与第三方库或既有项目整合.     ...

  6. 【转】vue.js三种安装方式

    Vue.js(读音 /vjuː/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.它不仅易于上手 ...

  7. vue.js三种安装方式

    Vue.js(读音 /vjuː/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.它不仅易于上手 ...

  8. Vue 常用三种传值方式

    Vue常用的三种传值方式: 父传子 子传父 非父子传值 引用官网一句话:父子组件的关系可以总结为 prop 向下传递,事件向上传递.父组件通过 prop 给子组件下发数据,子组件通过事件给父组件发送消 ...

  9. unity中三种调用其他脚本函数的方法

    第一种,被调用脚本函数为static类型,调用时直接用  脚本名.函数名()第二种,GameObject.Find("脚本所在的物体的名字").SendMessage(" ...

随机推荐

  1. bug和测试报告思维导图

    Bug定义: 1.不符合需求的 2.程序本身的报错 3.不符合用户使用习惯的 Bug生命周期: 当我们测试人员提交一个bug的时候,自始bug就有它的生命周期,从开始到结束, 把测试的过程和结果写成文 ...

  2. List<List<Object>> list = new ArrayList<List<Object>>(); 求回答补充问题 list.get(position).add(Object);为什么会报错啊我想在对应的list里面添加对象

    public static void main(String[] args){ List<List<Object>> list = new ArrayList<List& ...

  3. linux crontab 定时任务 邮件问题 及其相关的 dead.letter 问题

    最近开发项目的时候发现公司服务器用root账号登录的时候 一直会提示有新的信件,一直提示一直提示. 联想到另一台服务器上 的dead.letter文件每天都不断的变大  而且在 root家目录里 ,系 ...

  4. CountDownLatch和CyclicBarrier 傻傻的分不清?超长精美图文又来了

    你有一个思想,我有一个思想,我们交换后,一个人就有两个思想 If you can NOT explain it simply, you do NOT understand it well enough ...

  5. HTTPS协议详解(三):PKI 体系

    转自:https://blog.csdn.net/hherima/article/details/52469488 1.RSA身份验证的隐患    身份验证和密钥协商是TLS的基础功能,要求的前提是合 ...

  6. Java程序员阅读源码的小技巧,原来大牛都是这样读的,赶紧看看!

    今天介跟大家分享一下我平时阅读源码的几个小技巧,对于阅读java中间件如Spring.Dubbo等框架源码的同学有一定帮助. 本文基于Eclipse IDE,我们每天都使用的IDE其实提供了很多强大的 ...

  7. API测试之Postman使用全指南(原来使用 Postman测试API如此简单)

    Postman Postman是一个可扩展的API开发和测试协同平台工具,可以快速集成到CI/CD管道中.旨在简化测试和开发中的API工作流. Postman 工具有 Chrome 扩展和独立客户端, ...

  8. js element类型的属性和方法整理

    Element类型 除了Document类型,我们Web编程中最常用的类型就是Element类型啦.Element 类型用于表现XML或HTML元素,提供了对元素标签名,子节点,特性的访问 特征 no ...

  9. 关键字: this的使用

    1.可以调用的结构:属性.方法:构造器2.this调用属性.方法:this理解为:当前对象 或 当前正在创建的对象 2.1 在类的方法中,我们可以使用"this.属性"或" ...

  10. 洛谷 P1220 关路灯 区间DP

    题目描述 某一村庄在一条路线上安装了 n 盏路灯,每盏灯的功率有大有小(即同一段时间内消耗的电量有多有少).老张就住在这条路中间某一路灯旁,他有一项工作就是每天早上天亮时一盏一盏地关掉这些路灯. 为了 ...