由于使用svg制作圆形进度条,但是进度展示的太生硬,没有过渡圆滑的效果,所以使用 animate(在svg元素里可以查到) 元素标签,但

这样使用了,还是没有效果,我前端使用的 vue ,所以通过 @ 或 v-on 均无效

解决方法就是

声明这2个属性,在通过浏览器查看这2个事件绑定的区别

这就是区别,使用vue绑定事件加上Event结尾就行。

先声明下,我是使用svg的end事件遇到的问题,这种方法应该只能用于个例吧。

由于onend是属于被动触发的,所以这种方法只能自测看看,对于浏览器兼容没有测

这是成功绑定的事件图

至少,我这边解决这个问题了

SVG相关的网址:https://developer.mozilla.org/zh-CN/docs/Web/SVG

vue使用svg,animate事件绑定无效问题及解决方法的更多相关文章

  1. jQuery 新添加元素事件绑定无效

    jQuery中事件绑定,大多使用on就足够了. 但是对于新添加的元素 on 的绑定事件 会不起作用. 因为 append 中的 节点是在整个文档加载之后才添加的,页面并不会为未来的元素初始化添加点击事 ...

  2. android TextView多行文本(超过3行)使用ellipsize属性无效问题的解决方法

    这篇文章介绍了android TextView多行文本(超过3行)使用ellipsize属性无效问题的解决方法,有需要的朋友可以参考一下 布局文件中的TextView属性 复制代码代码如下: < ...

  3. vue.js的一些事件绑定和表单数据双向绑定

    知识点: v-on:相当于: 例如:v-on:click==@click ,menthods事件绑定 v-on修饰符可以指定键盘事件 v-model进行表单数据的双向绑定 <template&g ...

  4. vue样式操作与事件绑定

    Vue笔记 1 Vue实例 (VM) var vm = new Vue({    el:'#app', //挂载元素        //数据    data: {        title:'值', ...

  5. JavaScript之事件绑定多个序列执行方法

    //一种事件绑定多个方法:以加载事件为例 function addEventLoad(func,isLog) { var oldOnLoad = window.onload; if (typeof w ...

  6. jquery事件重复绑定的几种解决方法 (二)

    防止事件重复绑定共有4种方法: bind().unbind()方法 live().die()方法 off().on()方法 one()方法 一.bind().unbind()方法 bind();绑定事 ...

  7. jquery事件重复绑定的几种解决方法

    防止事件重复绑定共有4种方法: bind().unbind()方法 live().die()方法 off().on()方法 one()方法 一.bind().unbind()方法 bind();绑定事 ...

  8. 编写SqlHelper使用,在将ExecuteReader方法封装进而读取数据库中的数据时会产生Additional information: 阅读器关闭时尝试调用 Read 无效问题,解决方法与解释

    在自学杨中科老师的视频教学时,拓展编写SqlHelper使用,在将ExecuteReader方法封装进而读取数据库中的数据时 会产生Additional information: 阅读器关闭时尝试调用 ...

  9. table和div设置height:100%无效的完美解决方法

    刚接触网页排版的新手,常出现这种情况:设置table和div的高height="100%"无效,使用CSS来设置height:"100%"也无效,为什么会这样呢 ...

随机推荐

  1. 可视化BI软件为企业提升数据分析效率

    ​可视化BI软件经过几十年的不断发展,已成为大型企业进行商业决策不可缺少的工具.在BI软件问世之前,由于做数据分析可视化的时间较长.人力成本较高,企业一直处于忽视的状态.可视化BI软件的出现极大地提高 ...

  2. 推荐一款好用的国产web报表软件,轻松搞定复杂报表

    随着经济全球化程度的逐步加深以及全球市场的加速整合以便最大程度地对企业资源进行整合,从而达到降低成本和提高效率的目的.Web报表由于借助于web平台,即运用了B/S模式,即"浏览器/服务器& ...

  3. windev中字符串分隔符的选择以及Contains使用技巧

    字符串分隔符,理论上可以使用任意符号,但作为数据保存,建议只使用以下三种: 1.:分号 2.TAB制表符 3.CR换行符 主要有以下几个原因: 1.组织架构组件,获得的组织路径,使用TAB键分隔,TA ...

  4. Centos7使用kubeadm安装1.23.1版本的k8s集群

    系统环境 #cat /etc/redhat-release CentOS Linux release 7.6.1810 (Core) #Linux内核一定要大约等于3.10,也就是centos版本要大 ...

  5. 【C# IO 操作】 Path 路径类 |Directory类 |DirectoryInfo 类|DriveInfo类|File类|FileInfo类|FileStream类

    Directory类 Directory类 是一个静态类,常用的地方为创建目录和目录管理. 一下来看看它提供的操作. 1.CreateDirectory 根据指定路径创建目录.有重载,允许一次过创建多 ...

  6. kyverno VS gateKeeper

    kyverno VS gateKeeper 概述 这两组开源工具都是是基于kubernetes 的webhook机制,支持validatingwebhook和mutatingwebhook.整体思路上 ...

  7. 教程1--安装Git软件

    在https://git-scm.com/下载git for windows,双击安装即可. (1)单击Next (2)选择安装目录 (3)勾选创建桌面快捷方式.Git Bash.Git GUi.已经 ...

  8. Activity的创建及生命周期

  9. qt日常积累

    http://blog.sina.com.cn/s/blog_b8bcba160102yyi3.html

  10. SpringCloudConfig配置使用

    目录 SpringCloudConfig 是什么 作用 1.创建Git仓库 2.创建配置中心服务端 创建项目 导入pom 开启@EnableConfigServer YML 测试 全部资源请求方式 3 ...