vux组件绑定事件
我一开始是这样绑定事件的,但是没有效果:
<box gap="15px 45px">
<x-button plain type="primary" style="border-radius:99px;border:none;background-color:#099eeb;color:#fff;" @click="fn">登录</x-button>
</box>
于是,通过仔细查看vux文档:

这里很明白的说明:需要用@click.native来绑定:
<box gap="15px 45px">
<x-button plain type="primary" style="border-radius:99px;border:none;background-color:#099eeb;color:#fff;" @click.native="fn">登录</x-button>
</box>
这样就有效果了。
拓展,还有一种写法@click.native.prevent:
<box gap="15px 45px">
<x-button plain type="primary" style="border-radius:99px;border:none;background-color:#099eeb;color:#fff;" @click.native.prevent="fn">登录</x-button>
</box>
解释:
vux组件绑定事件的更多相关文章
- vue中组件绑定事件时是否加.native
组件绑定事件时 1. 普通组件绑定事件不能添加.native, 添加后事件失效 2. 自定义组件绑定事件需要添加.native, 否则事件无效 <template> <!-- < ...
- Vue--vue中的组件、组件绑定事件和数据、私有组件、子组件,父子组件参数互传
一.公有组件以及组件的使用和特点 <!DOCTYPE html> <html lang="en"> <head> <meta charse ...
- vue组件的hover事件模拟、给第三方组件绑定事件不生效问题
1.vue里面实现hover效果基本需要用事件模拟 <div @mouseover="overShow" @mouseout="outHide"> ...
- vuejs给组件绑定原生事件
给组件绑定事件,该事件是自定义的事件 <div id='root'> <child @click='handleClick'></child> </div&g ...
- vue组件添加事件@click.native
1,给vue组件绑定事件时候,必须加上native ,否则会认为监听的是来自Item组件自定义的事件 2,等同于在子组件中: 子组件内部处理click事件然后向外发送click事件:$emit(&q ...
- Angular4.x 创建组件|绑定数据|绑定属性|数据循环|条件判断|事件|表单处理|双向数据绑定
Angular4.x 创建组件|绑定数据|绑定属性|数据循环|条件判断|事件|表单处理|双向数据绑定 创建 angular 组件 https://github.com/angular/angular- ...
- Vue组件绑定自定义事件
Vue组件使用v-on绑定自定义事件: 可以分为3步理解: 1.在组件模板中按照正常事件机制绑定事件: template: '<button v-on:click="increment ...
- vue怎么给自定义组件绑定原生事件
下面主要以4个示例Demo演示(示例代码JS引用的Vue CDN),建议小伙伴直接复制示例代码运行查看, 赶时间的小伙伴可直接往下拉,看示例demo4 注:全局或局部注册的组件称为子组件,其中声明的 ...
- Vue学习之--------组件自定义事件(绑定、解绑)(2022/8/21)
文章目录 1.基础知识 2.代码实例 2.1 App.vue 2.2 school.vue 2.3 student.vue 3.测试效果(略) 4.实际应用(在组件化编码实战三的基础上改进) 4.1 ...
随机推荐
- java资料——哈希表(散列表)(转)
哈希表 散列表(Hash table,也叫哈希表),是根据关键码值(Key value)而直接进行访问的数据结构.也就是说,它通过把关键码值映射到表中一个位置来访问记录,以加快查找的速度. ...
- linux 使用NSF 映射远程磁盘目录
假设源目录在192.168.1.1机器上,目录为/data 客户端集群在192.168.1.2, 需要将192.168.1.1机器上的/data目录到本地的/data目录 1.在两台机器上安装nsf ...
- phalcon遇到的那些坑
1.数据重复插入 数据被重复插入,一般是在index/index方法中进行数据库insert操作,会发现一条数据被重复插了一次. 原因:浏览器有时候会自动请求 /favicon.ico ,而你的网站并 ...
- HTTP API 设计指南(响应部分)
前言 这篇指南介绍描述了 HTTP+JSON API 的一种设计模式,最初摘录整理自 Heroku 平台的 API 设计指引 Heroku 平台 API 指引. 这篇指南除了详细介绍现有的 API 外 ...
- larave框架的安装
(1)中文官网:http://www.golaravel.com/ (2)composer下载与安装 1:composer网址:getcomposer.org 2:windows下载Composer- ...
- 将DataFrame数据如何写入到Hive表中
1.将DataFrame数据如何写入到Hive表中?2.通过那个API实现创建spark临时表?3.如何将DataFrame数据写入hive指定数据表的分区中? 从spark1.2 到spark1.3 ...
- 继电器是如何成为CPU的
阅读目录(Content) 从电池.开关和继电器开始 用继电器做个与门 用继电器做个或门 用继电器做个异或门 做一些看起来可用的东西 小小约定 振荡器 加法器 寄存器 R-S触发器 D触发器 上升沿D ...
- spring 优点
spring 的优点?1.降低了组件之间的耦合性 ,实现了软件各层之间的解耦 2.可以使用容易提供的众多服务,如事务管理,消息服务等 3.容器提供单例模式支持 4.容器提供了AOP技术,利用它很容易实 ...
- free 和delete 把指针怎么啦?
别看 free 和 delete 的名字恶狠狠的(尤其是 delete),它们只是把指针所指的内存给 释放掉,但并没有把指针本身干掉. 发现指针 p 被 free 以后其地址仍然不变(非 NULL), ...
- php -- or 的用法
经常看到这样的语句: $file = fopen($filename, r) or die("抱歉,无法打开: $filename"); or 在这里是这样理解的,因为在PHP中并 ...