cvs/docs/.vuepress/dist/assets/js/17.bd3acf61.js

A basic canvas framework for 2d drawing.

(window.webpackJsonp=window.webpackJsonp||[]).push([[17],{232:function(t,s,a){"use strict";a.r(s);var n=a(0),e=Object(n.a)({},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",{staticClass:"content"},[t._m(0),t._v(" "),a("p",[t._v("所有元素和组合的基类，该类不对外暴露，你可以在这里看到所有元素的公共属性和方法。")]),t._v(" "),t._m(1),t._v(" "),t._m(2),t._v(" "),t._m(3),t._v(" "),t._m(4),t._v(" "),t._m(5),t._v(" "),t._m(6),t._v(" "),t._m(7),t._v(" "),t._m(8),t._v(" "),t._m(9),t._v(" "),t._m(10),t._v(" "),t._m(11),t._v(" "),t._m(12),t._v(" "),a("ul",[t._m(13),t._v(" "),a("li",[a("p",[t._v("参数：")]),t._v(" "),t._m(14),t._v(" "),a("p",[t._v("keyframes 至少需要有两项，分别代表第一帧和最后一帧，第一帧中需要指明可能变化的所有属性的初始值，之后的帧中可以省略不变的属性。")]),t._v(" "),t._m(15),t._v(" "),t._m(16),t._v(" "),a("div",{staticClass:"tip custom-block"},[a("p",{staticClass:"custom-block-title"},[t._v("TIP")]),t._v(" "),a("p",[t._v("easing 可选值有 "),a("code",[t._v("linear")]),t._v(", "),a("code",[t._v("ease")]),t._v(", "),a("code",[t._v("ease-in")]),t._v(", "),a("code",[t._v("ease-out")]),t._v(", "),a("code",[t._v("ease-in-out")]),t._v(" 或者一个代表"),a("a",{attrs:{href:"https://blog.csdn.net/wjnf012/article/details/78795573",target:"_blank",rel:"noopener noreferrer"}},[t._v(" cubic-bezier 函数"),a("OutboundLink")],1),t._v("传参的数组，如"),a("code",[t._v("[0.42, 0, 0.58, 1]")])])])])]),t._v(" "),t._m(17),t._v(" "),t._m(18),t._v(" "),t._m(19),t._v(" "),t._m(20),t._v(" "),t._m(21)])},[function(){var t=this.$createElement,s=this._self._c||t;return s("h3",{attrs:{id:"element"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#element","aria-hidden":"true"}},[this._v("#")]),this._v(" Element")])},function(){var t=this.$createElement,s=this._self._c||t;return s("h3",{attrs:{id:"options"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#options","aria-hidden":"true"}},[this._v("#")]),this._v(" options")])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("table",[a("thead",[a("tr",[a("th",[t._v("options.key")]),t._v(" "),a("th",[t._v("value")]),t._v(" "),a("th",[t._v("description")]),t._v(" "),a("th",[t._v("default")])])]),t._v(" "),a("tbody",[a("tr",[a("td",[t._v("id")]),t._v(" "),a("td",[t._v("String")]),t._v(" "),a("td",[t._v("规定元素的 id")]),t._v(" "),a("td",[t._v("一个自然数")])]),t._v(" "),a("tr",[a("td",[t._v("zIndex")]),t._v(" "),a("td",[t._v("Number")]),t._v(" "),a("td",[t._v("规定元素在 z 轴上的坐标")]),t._v(" "),a("td",[a("code",[t._v("0")])])]),t._v(" "),a("tr",[a("td",[t._v("visible")]),t._v(" "),a("td",[t._v("Boolean")]),t._v(" "),a("td",[t._v("规定元素是否可见")]),t._v(" "),a("td",[a("code",[t._v("true")])])]),t._v(" "),a("tr",[a("td",[t._v("x")]),t._v(" "),a("td",[t._v("Number")]),t._v(" "),a("td",[t._v("规定元素矩阵变换前的左上角 x 轴坐标")]),t._v(" "),a("td",[a("code",[t._v("0")])])]),t._v(" "),a("tr",[a("td",[t._v("y")]),t._v(" "),a("td",[t._v("Number")]),t._v(" "),a("td",[t._v("规定元素矩阵变换前的左上角 y 轴坐标")]),t._v(" "),a("td",[a("code",[t._v("0")])])]),t._v(" "),a("tr",[a("td",[t._v("transformOrigin")]),t._v(" "),a("td",[t._v("Number|Array")]),t._v(" "),a("td",[t._v("规定元素矩阵变换的的原点与元素左上角的偏移量")]),t._v(" "),a("td",[t._v("--")])]),t._v(" "),a("tr",[a("td",[t._v("rotate")]),t._v(" "),a("td",[t._v("Number")]),t._v(" "),a("td",[t._v("规定元素矩阵变换中旋转的角度")]),t._v(" "),a("td",[a("code",[t._v("0")])])]),t._v(" "),a("tr",[a("td",[t._v("scale")]),t._v(" "),a("td",[t._v("Number|Array")]),t._v(" "),a("td",[t._v("规定元素矩阵变换中 x 轴与 y 轴缩放的倍数")]),t._v(" "),a("td",[a("code",[t._v("[1, 1]")])])]),t._v(" "),a("tr",[a("td",[t._v("translate")]),t._v(" "),a("td",[t._v("Number|Array")]),t._v(" "),a("td",[t._v("规定元素矩阵变换中 x 轴与 y 轴移动的距离")]),t._v(" "),a("td",[a("code",[t._v("[0, 0]")])])]),t._v(" "),a("tr",[a("td",[t._v("skew")]),t._v(" "),a("td",[t._v("Number|Array")]),t._v(" "),a("td",[t._v("规定元素矩阵变换中 x 轴与 y 轴倾斜的角度")]),t._v(" "),a("td",[a("code",[t._v("[0, 0]")])])]),t._v(" "),a("tr",[a("td",[t._v("transform")]),t._v(" "),a("td",[t._v("Array")]),t._v(" "),a("td",[t._v("规定元素矩阵变换中的矩阵")]),t._v(" "),a("td",[a("code",[t._v("[1, 0, 0, 1, 0, 0]")])])]),t._v(" "),a("tr",[a("td",[t._v("offsetPath")]),t._v(" "),a("td",[t._v("String|Object")]),t._v(" "),a("td",[t._v("规定运动路径")]),t._v(" "),a("td",[t._v("--")])])])])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("div",{staticClass:"tip custom-block"},[a("p",{staticClass:"custom-block-title"},[t._v("TIP")]),t._v(" "),a("p",[a("code",[t._v("transformOrigin: [50, 50]")]),t._v("表示元素矩阵变换的原点为"),a("code",[t._v("[x + 50, y + 50]")]),t._v("，可以缩写为"),a("code",[t._v("transformOrigin: 50")]),t._v("。"),a("code",[t._v("scale")]),t._v("、"),a("code",[t._v("translate")]),t._v("、"),a("code",[t._v("skew")]),t._v("的缩写形式同理。")])])},function(){var t=this.$createElement,s=this._self._c||t;return s("div",{staticClass:"tip custom-block"},[s("p",{staticClass:"custom-block-title"},[this._v("TIP")]),this._v(" "),s("p",[this._v("offsetPath 的值和 Path 元素的 d 形式相同，在关键帧中使用 offsetDistance 定义进度。")])])},function(){var t=this.$createElement,s=this._self._c||t;return s("h3",{attrs:{id:"实例属性"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#实例属性","aria-hidden":"true"}},[this._v("#")]),this._v(" 实例属性")])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("table",[a("thead",[a("tr",[a("th",[t._v("property")]),t._v(" "),a("th",[t._v("value")]),t._v(" "),a("th",[t._v("description")]),t._v(" "),a("th",[t._v("example")])])]),t._v(" "),a("tbody",[a("tr",[a("td",[t._v("size")]),t._v(" "),a("td",[t._v("Array")]),t._v(" "),a("td",[t._v("元素的大小(第一项表示宽，第二项表示高)")]),t._v(" "),a("td",[a("code",[t._v("[100, 80]")])])]),t._v(" "),a("tr",[a("td",[t._v("center")]),t._v(" "),a("td",[t._v("Array")]),t._v(" "),a("td",[t._v("元素相对于父元素的的中心点坐标(第一项表示 x 轴坐标，第二项表示 y 轴坐标)")]),t._v(" "),a("td",[a("code",[t._v("[12, 12]")])])]),t._v(" "),a("tr",[a("td",[t._v("bounds")]),t._v(" "),a("td",[t._v("Array")]),t._v(" "),a("td",[t._v("元素相对于父元素的左上角（前两项）和右下角（后两项）的坐标")]),t._v(" "),a("td",[a("code",[t._v("[12, 12, 110, 110]")])])])])])},function(){var t=this.$createElement,s=this._self._c||t;return s("h3",{attrs:{id:"实例方法"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#实例方法","aria-hidden":"true"}},[this._v("#")]),this._v(" 实例方法")])},function(){var t=this.$createElement,s=this._self._c||t;return s("h4",{attrs:{id:"attr-opt"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#attr-opt","aria-hidden":"true"}},[this._v("#")]),this._v(" attr(opt)")])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("ul",[a("li",[a("p",[t._v("描述：")]),t._v(" "),a("p",[t._v("获取或设置元素属性")])]),t._v(" "),a("li",[a("p",[t._v("参数：")]),t._v(" "),a("ul",[a("li",[a("code",[t._v("{String | Object} opt")]),t._v(" 参数类型为"),a("code",[t._v("String")]),t._v("表示获取属性，"),a("code",[t._v("Object")]),t._v("表示设置属性")])])]),t._v(" "),a("li",[a("p",[t._v("示例：")]),t._v(" "),a("div",{staticClass:"language-js extra-class"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[a("span",{attrs:{class:"token comment"}},[t._v("// 获取元素属性")]),t._v("\nelememt"),a("span",{attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{attrs:{class:"token function"}},[t._v("attr")]),a("span",{attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{attrs:{class:"token string"}},[t._v('"x"')]),a("span",{attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),a("span",{attrs:{class:"token comment"}},[t._v("// 设置元素属性")]),t._v("\nelememt"),a("span",{attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{attrs:{class:"token function"}},[t._v("attr")]),a("span",{attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" x"),a("span",{attrs:{class:"token punctuation"}},[t._v(":")]),t._v(" "),a("span",{attrs:{class:"token number"}},[t._v("12")]),a("span",{attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" y"),a("span",{attrs:{class:"token punctuation"}},[t._v(":")]),t._v(" "),a("span",{attrs:{class:"token number"}},[t._v("34")]),t._v(" "),a("span",{attrs:{class:"token punctuation"}},[t._v("}")]),a("span",{attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])])])])},function(){var t=this.$createElement,s=this._self._c||t;return s("h4",{attrs:{id:"clone-options"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#clone-options","aria-hidden":"true"}},[this._v("#")]),this._v(" clone(options)")])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("ul",[a("li",[a("p",[t._v("描述：")]),t._v(" "),a("p",[t._v("基于当前元素克隆一个新的元素")])]),t._v(" "),a("li",[a("p",[t._v("参数：")]),t._v(" "),a("ul",[a("li",[a("code",[t._v("{Object} options")]),t._v(" 新元素的属性")])]),t._v(" "),a("div",{staticClass:"tip custom-block"},[a("p",{staticClass:"custom-block-title"},[t._v("TIP")]),t._v(" "),a("p",[t._v("支持不传参数，将返回一个和原元素属性相同的元素")])])]),t._v(" "),a("li",[a("p",[t._v("返回值："),a("code",[t._v("{Element}")]),t._v(" 新的元素")])]),t._v(" "),a("li",[a("p",[t._v("示例：")]),t._v(" "),a("div",{staticClass:"language-js extra-class"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[a("span",{attrs:{class:"token keyword"}},[t._v("let")]),t._v(" rect "),a("span",{attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),a("span",{attrs:{class:"token keyword"}},[t._v("new")]),t._v(" "),a("span",{attrs:{class:"token class-name"}},[t._v("Rect")]),a("span",{attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n  w"),a("span",{attrs:{class:"token punctuation"}},[t._v(":")]),t._v(" "),a("span",{attrs:{class:"token number"}},[t._v("50")]),a("span",{attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n  h"),a("span",{attrs:{class:"token punctuation"}},[t._v(":")]),t._v(" "),a("span",{attrs:{class:"token number"}},[t._v("50")]),a("span",{attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n  x"),a("span",{attrs:{class:"token punctuation"}},[t._v(":")]),t._v(" "),a("span",{attrs:{class:"token number"}},[t._v("150")]),a("span",{attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n  y"),a("span",{attrs:{class:"token punctuation"}},[t._v(":")]),t._v(" "),a("span",{attrs:{class:"token number"}},[t._v("350")]),t._v("\n"),a("span",{attrs:{class:"token punctuation"}},[t._v("}")]),a("span",{attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),a("span",{attrs:{class:"token keyword"}},[t._v("let")]),t._v(" rect2 "),a("span",{attrs:{class:"token operator"}},[t._v("=")]),t._v(" rect"),a("span",{attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{attrs:{class:"token function"}},[t._v("clone")]),a("span",{attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" y"),a("span",{attrs:{class:"token punctuation"}},[t._v(":")]),t._v(" "),a("span",{attrs:{class:"token number"}},[t._v("100")]),t._v(" "),a("span",{attrs:{class:"token punctuation"}},[t._v("}")]),a("span",{attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])])])])},function(){var t=this.$createElement,s=this._self._c||t;return s("h4",{attrs:{id:"keyframe-keyframes-timing"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#keyframe-keyframes-timing","aria-hidden":"true"}},[this._v("#")]),this._v(" keyframe(keyframes, timing)")])},function(){var t=this.$createElement,s=this._self._c||t;return s("li",[s("p",[this._v("描述：")]),this._v(" "),s("p",[this._v("为元素添加关键帧动画，支持链式调用")])])},function(){var t=this.$createElement,s=this._self._c||t;return s("ul",[s("li",[s("code",[this._v("{Array} keyframes")]),this._v(" 关键帧的属性描述")])])},function(){var t=this.$createElement,s=this._self._c||t;return s("ul",[s("li",[s("code",[this._v("{Object} timing")]),this._v(" timing 对象支持以下属性")])])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("table",[a("thead",[a("tr",[a("th",[t._v("timing.key")]),t._v(" "),a("th",[t._v("value")]),t._v(" "),a("th",[t._v("description")]),t._v(" "),a("th",[t._v("default")])])]),t._v(" "),a("tbody",[a("tr",[a("td",[t._v("delay")]),t._v(" "),a("td",[t._v("Number")]),t._v(" "),a("td",[t._v("规定运动延迟时间")]),t._v(" "),a("td",[a("code",[t._v("0")])])]),t._v(" "),a("tr",[a("td",[t._v("duration")]),t._v(" "),a("td",[t._v("Number")]),t._v(" "),a("td",[t._v("规定运动持续时间")]),t._v(" "),a("td",[t._v("--")])]),t._v(" "),a("tr",[a("td",[t._v("easing")]),t._v(" "),a("td",[t._v("String | Array")]),t._v(" "),a("td",[t._v("规定动画的 easing 函数")]),t._v(" "),a("td",[a("code",[t._v("linear")])])])])])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("ul",[a("li",[a("p",[t._v("返回值："),a("code",[t._v("{Element}")]),t._v(" 元素自身")])]),t._v(" "),a("li",[a("p",[t._v("示例：")]),t._v(" "),a("div",{staticClass:"language-js extra-class"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[a("span",{attrs:{class:"token keyword"}},[t._v("let")]),t._v(" rect "),a("span",{attrs:{class:"token operator"}},[t._v("=")]),t._v(" "),a("span",{attrs:{class:"token keyword"}},[t._v("new")]),t._v(" "),a("span",{attrs:{class:"token class-name"}},[t._v("Rect")]),a("span",{attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n  w"),a("span",{attrs:{class:"token punctuation"}},[t._v(":")]),t._v(" "),a("span",{attrs:{class:"token number"}},[t._v("80")]),a("span",{attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n  h"),a("span",{attrs:{class:"token punctuation"}},[t._v(":")]),t._v(" "),a("span",{attrs:{class:"token number"}},[t._v("80")]),a("span",{attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n  x"),a("span",{attrs:{class:"token punctuation"}},[t._v(":")]),t._v(" "),a("span",{attrs:{class:"token number"}},[t._v("0")]),a("span",{attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n  y"),a("span",{attrs:{class:"token punctuation"}},[t._v(":")]),t._v(" "),a("span",{attrs:{class:"token number"}},[t._v("180")]),a("span",{attrs:{class:"token punctuation"}},[t._v(",")]),t._v("\n  fill"),a("span",{attrs:{class:"token punctuation"}},[t._v(":")]),t._v(" "),a("span",{attrs:{class:"token string"}},[t._v('"green"')]),t._v("\n"),a("span",{attrs:{class:"token punctuation"}},[t._v("}")]),a("span",{attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\nrect"),a("span",{attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{attrs:{class:"token function"}},[t._v("keyframe")]),a("span",{attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{attrs:{class:"token punctuation"}},[t._v("[")]),a("span",{attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" fill"),a("span",{attrs:{class:"token punctuation"}},[t._v(":")]),t._v(" rect"),a("span",{attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{attrs:{class:"token function"}},[t._v("attr")]),a("span",{attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{attrs:{class:"token string"}},[t._v('"fill"')]),a("span",{attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),a("span",{attrs:{class:"token punctuation"}},[t._v("}")]),a("span",{attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),a("span",{attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" fill"),a("span",{attrs:{class:"token punctuation"}},[t._v(":")]),t._v(" "),a("span",{attrs:{class:"token string"}},[t._v('"red"')]),t._v(" "),a("span",{attrs:{class:"token punctuation"}},[t._v("}")]),a("span",{attrs:{class:"token punctuation"}},[t._v("]")]),a("span",{attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),a("span",{attrs:{class:"token number"}},[t._v("4000")]),a("span",{attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\nrect"),a("span",{attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{attrs:{class:"token function"}},[t._v("keyframe")]),a("span",{attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{attrs:{class:"token punctuation"}},[t._v("[")]),a("span",{attrs:{class:"token string"}},[t._v('"fill"')]),a("span",{attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),a("span",{attrs:{class:"token punctuation"}},[t._v("{")]),t._v(" fill"),a("span",{attrs:{class:"token punctuation"}},[t._v(":")]),t._v(" "),a("span",{attrs:{class:"token string"}},[t._v('"red"')]),t._v(" "),a("span",{attrs:{class:"token punctuation"}},[t._v("}")]),a("span",{attrs:{class:"token punctuation"}},[t._v("]")]),a("span",{attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),a("span",{attrs:{class:"token number"}},[t._v("4000")]),a("span",{attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\nfgLayer"),a("span",{attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{attrs:{class:"token function"}},[t._v("append")]),a("span",{attrs:{class:"token punctuation"}},[t._v("(")]),t._v("rect"),a("span",{attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),a("p",[t._v("以上代码中 "),a("code",[t._v("{ fill: rect.attr('fill') }")]),t._v(" 写法显得过于繁琐，因此也支持省略写法："),a("code",[t._v("['fill']")]),t._v(", 如果变化的属性只有一个还可以直接使用字符串，所以可以缩写为："),a("code",[t._v("rect.keyframe(['fill', { fill: \"red\" }], 4000);")])])])])},function(){var t=this.$createElement,s=this._self._c||t;return s("h4",{attrs:{id:"on-eventtype-callback"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#on-eventtype-callback","aria-hidden":"true"}},[this._v("#")]),this._v(" on(eventType, callback)")])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("ul",[a("li",[a("p",[t._v("描述：")]),t._v(" "),a("p",[t._v("为元素绑定事件监听")])]),t._v(" "),a("li",[a("p",[t._v("参数：")]),t._v(" "),a("ul",[a("li",[a("code",[t._v("{string} eventType")]),t._v("规定绑定的事件名称，可选值: "),a("code",[t._v("click")]),t._v("、"),a("code",[t._v("mousedown")]),t._v("、"),a("code",[t._v("mouseup")]),t._v("、"),a("code",[t._v("mousemove")]),t._v("、"),a("code",[t._v("touchstart")]),t._v("、"),a("code",[t._v("touchend")]),t._v("、"),a("code",[t._v("touchmove")]),t._v("、"),a("code",[t._v("mouseenter")]),t._v("、"),a("code",[t._v("mouseleave")])]),t._v(" "),a("li",[a("code",[t._v("{Function} callback")]),t._v("规定监听函数")])]),t._v(" "),a("div",{staticClass:"tip custom-block"},[a("p",{staticClass:"custom-block-title"},[t._v("TIP")]),t._v(" "),a("p",[t._v("callback 会接收一个包含事件信息的参数"),a("code",[t._v("e")]),t._v("，通过"),a("code",[t._v("e.originalEvent")]),t._v("可获得原始事件的参数")])])]),t._v(" "),a("li",[a("p",[t._v("示例：")]),t._v(" "),a("div",{staticClass:"language-js extra-class"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[t._v("element"),a("span",{attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{attrs:{class:"token function"}},[t._v("on")]),a("span",{attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{attrs:{class:"token string"}},[t._v('"click"')]),a("span",{attrs:{class:"token punctuation"}},[t._v(",")]),t._v(" "),a("span",{attrs:{class:"token keyword"}},[t._v("function")]),a("span",{attrs:{class:"token punctuation"}},[t._v("(")]),t._v("e"),a("span",{attrs:{class:"token punctuation"}},[t._v(")")]),t._v(" "),a("span",{attrs:{class:"token punctuation"}},[t._v("{")]),t._v("\n  console"),a("span",{attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{attrs:{class:"token function"}},[t._v("log")]),a("span",{attrs:{class:"token punctuation"}},[t._v("(")]),t._v("e"),a("span",{attrs:{class:"token punctuation"}},[t._v(".")]),t._v("originalEvent"),a("span",{attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n"),a("span",{attrs:{class:"token punctuation"}},[t._v("}")]),a("span",{attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])])])])},function(){var t=this.$createElement,s=this._self._c||t;return s("h4",{attrs:{id:"off-eventtype"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#off-eventtype","aria-hidden":"true"}},[this._v("#")]),this._v(" off(eventType)")])},function(){var t=this,s=t.$createElement,a=t._self._c||s;return a("ul",[a("li",[a("p",[t._v("描述：")]),t._v(" "),a("p",[t._v("为元素取消绑定事件监听")])]),t._v(" "),a("li",[a("p",[t._v("参数：")]),t._v(" "),a("ul",[a("li",[a("code",[t._v("{string} eventType")]),t._v("规定绑定的事件名称，可选值: "),a("code",[t._v("click")])])])]),t._v(" "),a("li",[a("p",[t._v("示例：")]),t._v(" "),a("div",{staticClass:"language-js extra-class"},[a("pre",{pre:!0,attrs:{class:"language-js"}},[a("code",[t._v("element"),a("span",{attrs:{class:"token punctuation"}},[t._v(".")]),a("span",{attrs:{class:"token function"}},[t._v("off")]),a("span",{attrs:{class:"token punctuation"}},[t._v("(")]),a("span",{attrs:{class:"token string"}},[t._v('"click"')]),a("span",{attrs:{class:"token punctuation"}},[t._v(")")]),a("span",{attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])])])])}],!1,null,null,null);e.options.__file="element.md";s.default=e.exports}}]);