用.native修饰器来对外部组件进行构造器内部方法的调用以及用原生js获取构造器里的方法

时间:2022-12-22 19:25:40

html

<div id="app">
<span v-text="number"></span>
<btn @click.native="add(10,$event)"></btn>
<button @click="add(10,$event)">add</button>
</div>
<button onclick="vm.add(10)">外部用原生js调用</button>

js

var btn = {
template:`<button>外部组件条用构造器内部方法</button>`
}
var vm = new Vue({
el:"#app",
data:{
number:1
},
methods:{
// 记得return 出来啊
add:function(num,event){
if(num!=""){
this.number+=num;
}else{
this.number++;
}
// 点击的很多属性都在里面
console.log(event);
}
},
components:{
"btn":btn
}
})

用.native修饰器来对外部组件进行构造器内部方法的调用以及用原生js获取构造器里的方法的更多相关文章

  1. 修饰器&amp&semi;高阶组件

    一.修饰器 1.类的修饰 修饰器是一个函数,用来修改类的行为 function testable(target) { target.isTestable = true; } @testable cla ...

  2. 19&period;Decorator修饰器

    Decorator 修饰器 类的修饰 许多面向对象的语言都有修饰器(Decorator)函数,用来修改类的行为.目前,有一个提案将这项功能,引入了 ECMAScript. @testable clas ...

  3. 修饰器Decorator

    类的修饰 许多面向对象的语言都有修饰器(Decorator)函数,用来修改类的行为.目前,有一个提案将这项功能,引入了 ECMAScript. @testable class MyTestableCl ...

  4. 使用 js 修饰器封装 axios

    修饰器 修饰器是一个 JavaScript 函数(建议是纯函数),它用于修改类属性/方法或类本身.修饰器提案正处于第二阶段,我们可以使用 babel-plugin-transform-decorato ...

  5. python 修饰器(decorator)

    转载:Python之修饰器 - 知乎 (zhihu.com) 什么是修饰器,为什么叫修饰器 修饰器英文是Decorator, 我们假设这样一种场景:古老的代码中有几个很是复杂的函数F1.F2.F3.. ...

  6. vue&period;js实战——&period;native修饰符

    https://blog.csdn.net/qq_29468573/article/details/80771625 除了用v-on在组件上监听自定义事件外,也可以监听DOM事件,这时可以用.nati ...

  7. vue中的&period;native修饰符

    如果你想在某个组件的根元素上绑定事件,直接使用 @click=''function' 是不生效的,我们可以添加.native修饰符 @click.native=''function'',请看以下dem ...

  8. Vue中的native修饰符解析

    native修饰符 一般来说,vue本身提供了v-on:eventName这个语法来提供vue的时事件绑定,通常使用@eventName这个语法糖代替上述语法. 使用过程中没有考虑@eventName ...

  9. elementUI &period;native修饰符

    用第三方组件或者UI框架会自带自身封装的事件,如keyup等,会覆盖原生的组件而无法起效果 .native 修饰符就是用来注册元素的原生事件而不是组件自定义事件的 如elementUI的:<el ...

随机推荐

  1. 计算std&colon;string的字节长度

    如果项目本身是使用 Unicode 字符集和utf8编码,std::string的length(),size()甚至是c的strLen取到的都是字节长度了,比如三个汉字,就是9, 以上情况不满足的话, ...

  2. wamp启动mysql的命令

    输入net start mysql提示服务名无效是因为在wamp集成安装中,mysql的服务名字是叫wampmysqld,可以用net start查看服务列表.所以命令启动mysql就应该输入net ...

  3. Swiper 判断上滑下拉操作

    onTouchMove: function(swiper){ //手动滑动中触发//判断上滑下拉var i = mySwiper.translate;setTimeout(function() {va ...

  4. FJNU Fang G and his Friends(状压DP)题解

    Description     众所周知,fang G 有很多小伙伴,有一天,Fang G 打算带他们去玩有趣的游戏OOXX,这个游戏需要分成两组,有趣的是,每个人互相之间都有一个满意度,大家都想和自 ...

  5. &lbrack;Tools&rsqb; Wireshark Primer Tutorials

    介绍就不说了,安装也没必要讲,关于如何使用,网上的辣鸡文过多,视频又太冗余. 我推荐看下面有条理的入门教程. 界面说明:http://openmaniak.com/cn/wireshark_use.p ...

  6. whith ~ as 用法

    个人理解 with self.client.get("/", catch_response=True) as response: 其实就是 response = self.clie ...

  7. google kaptcha 验证码的使用

    这边演示下idea+maven+servlet实现谷歌的kaptcha验证码的使用: web.xml, 这边主要是kaptcha验证器, <!DOCTYPE web-app PUBLIC &qu ...

  8. Highways---poj1751最小生成树

    http://poj.org/problem?id=1751 题意:有n个点,已知各点坐标,距离为权值,求最小生成树的边 但是这个最小生成树的m条边是已经确定的了,所以可以让已知边的权值为0: 在Pr ...

  9. 弱也有弱的ACM经历

    作为一名弱校的acm渣渣,在经历了三年的acm生涯后,现在终于要毕业了,最后也来总结下自己在这几年中做acm的经历与感受.以下是参赛总结: 2013年: ACM/ICPC长沙邀请赛(打铁=_=) AC ...

  10. 【Maven学习】Maven打包生成包含所有依赖的jar包

    http://blog.csdn.net/u013177446/article/details/54134583 ******************************************* ...