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. linux网络编程-posix条件变量(40)

    举一个列子来说明条件变量: 假设有两个线程同时访问全局变量n,初始化值是0, 一个线程进入临界区,进行互斥操作,线程当n大于0的时候才执行下面的操作,如果n不大于0,该线程就一直等待. 另外一个线程也 ...

  2. 学习oracle的SQL语句 练习

    --1.查询emp表,显示薪水大于2000,且工作类别是MANAGER的雇员信息 select * from emp where sal > 2000and job = 'MANAGER'; - ...

  3. 区间dp 能量项链 洛谷p1063

    题目大意:如果前一颗能量珠的头标记为m,尾标记为r,后一颗能量珠的头标记为r,尾标记为n,则聚合后释放的能量为 (Mars单位),新产生的珠子的头标记为m,尾标记为n. 需要时,Mars人就用吸盘夹住 ...

  4. 【秒懂Java】【第1章_初识Java】04_学习资料

    为了学到更多的新知识,我们经常会去网上搜索各种学习资料.或者,在学习.工作过程中遇到了解决不了的问题,我们也会去网上搜索答案(比如百度.谷歌一下).这篇文章,主要想跟大家聊聊关于学习资料的选择. 建议 ...

  5. Java基础Day07(Map Calender Date 包装类 System类 异常)

    1.Map Map是集合容器,存放的元素有键与值两部分组成,通过键可以找到所对应的值,键和值必须是引用数据类型,键是唯一的,不能重复,没有顺序. HashMap是Map的实现类. Map的添加,删除, ...

  6. 十位大牛做出的web前端开发规范总结

    Web前端作为开发团队中不可或缺的一部分,需要按照相关规定进行合理编写(一部分不良习惯可能给自己和他人造成不必要的麻烦).不同公司不同团队具有不同的规范和文档.下面是根据不同企业和团队的要求进行全面详 ...

  7. .gitkeep文件

    git 默认不会对空文件夹进行追踪: 但某些项目某些文件夹对整体框架是必不可少的,就算是空也得有: 怎么办呢?在这个文件夹下添加一个[.gitkeep]文件,这样就可以同步该文件夹了. (完)

  8. python 实现汉诺塔

    汉诺塔:汉诺塔(又称河内塔)问题是源于印度一个古老传说的益智玩具.大梵天创造世界的时候做了三根金刚石柱子,在一根柱子上从下往上按照大小顺序摞着64片黄金圆盘. 大梵天命令婆罗门把圆盘从下面开始按大小顺 ...

  9. bootstrap悬停下拉菜单显示

    使用Bootstrap导航条组件时,如果你的导航条带有下拉菜单,那么这个带下拉菜单的导航在点击时只会浮出下拉菜单,它本身的href属性会失效,也就是失去了超链接功能,这并不是我想要的,我希望导航条的链 ...

  10. How many ways??,题解

    题目: 题意: 找过k条边的路径个数. 分析: 首先注意一下题意,同一个点过两次算两次,做过类似的,过k条边的最短路,只要搞一个矩阵,然后快速幂就好了,这个也一样,维护信息变一下,然后就好了. 如果k ...