* [html5] fix trigger click problem.
Project: http://git-wip-us.apache.org/repos/asf/incubator-weex/repo Commit: http://git-wip-us.apache.org/repos/asf/incubator-weex/commit/b7fa6b0f Tree: http://git-wip-us.apache.org/repos/asf/incubator-weex/tree/b7fa6b0f Diff: http://git-wip-us.apache.org/repos/asf/incubator-weex/diff/b7fa6b0f Branch: refs/heads/master Commit: b7fa6b0ff7af1b4d18823709fe43569cc5b69b9a Parents: 6ec5a50 Author: MrRaindrop <tekk...@gmail.com> Authored: Sat Sep 23 18:51:20 2017 +0800 Committer: MrRaindrop <tekk...@gmail.com> Committed: Sat Sep 23 18:51:20 2017 +0800 ---------------------------------------------------------------------- html5/render/vue/README.md | 4 ++ html5/render/vue/env/event-manager.js | 88 +++++++++++++++--------------- package.json | 2 +- packages/weex-vue-render/README.md | 4 ++ packages/weex-vue-render/package.json | 2 +- 5 files changed, 55 insertions(+), 45 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/b7fa6b0f/html5/render/vue/README.md ---------------------------------------------------------------------- diff --git a/html5/render/vue/README.md b/html5/render/vue/README.md index 0554334..31646a2 100644 --- a/html5/render/vue/README.md +++ b/html5/render/vue/README.md @@ -172,6 +172,10 @@ vue: { * fix loading & refresh: pulling down wrongly triggered. +#### 0.12.15 + +* not to prevent default behaviour of click events unless the click-binding element is inside a `<a>` link, or it is a `<a>` link and has a `prevent` attribute on it. + ## component -> dom map | component | dom element | children | note | http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/b7fa6b0f/html5/render/vue/env/event-manager.js ---------------------------------------------------------------------- diff --git a/html5/render/vue/env/event-manager.js b/html5/render/vue/env/event-manager.js index 16057ca..e637b7d 100644 --- a/html5/render/vue/env/event-manager.js +++ b/html5/render/vue/env/event-manager.js @@ -35,6 +35,15 @@ function isANode (el) { return el.tagName.toLowerCase() === 'a' } +function isInANode (el) { + let parent = el.parentElement + while (parent && parent !== document.body) { + if (parent.tagName === 'A') { return true } + parent = parent.parentElement + } + return false +} + /** * get listeners from on config and v-on binding. * v-on binding has a priority over on config. @@ -87,72 +96,65 @@ function _init (doc) { return } let disposed = false - let evtName = e.type - /** - * take full control of redirection of <a> element. - */ - if (evtName === 'click') { - // use '_triggered' to control bubbles event. - e._triggered = { target: vm.$el } - e.preventDefault() - return - } + const evtName = e.type if (evtName === 'tap' && e._for !== 'weex') { return } - else if (evtName === 'tap') { - evtName = 'click' - } while (vm) { const vnode = vm._vnode || vm.$vnode const elm = vm.$el - const ons = getListeners(vnode, evtName) + const ons = getListeners(vnode, evtName === 'tap' ? 'click' : evtName) const len = ons && ons.length if (len > 0) { - for (let i = 0; i < len; i++) { - const handler = ons[i] - const newEvt = evtName === 'click' - ? createEvent(el, evtName) - : e - applyFns(handler.fns, newEvt) + if (evtName !== 'click') { + for (let i = 0; i < len; i++) { + const handler = ons[i] + const newEvt = evtName === 'tap' + ? createEvent(el, 'click') + : e + newEvt._triggered = { target: elm } + applyFns(handler.fns, newEvt) + } } - e._triggered = { target: vm.$el } + e._triggered = { target: elm } disposed = true } - /** - * if the handler is binding on a <a> element, should trigger - * the handler first and then jump to href. - * NOTE: if target==='_blank' then do no jumping and leave it - * to users binding handlers for further disposing. - */ - if (evtName === 'click' && isANode(elm)) { + if (isANode(elm) + && (evtName === 'click' || evtName === 'tap')) { const href = elm.getAttribute('href') const voidHrefReg = /^\s*javascript\s*:\s*void\s*(?:\(\s*0\s*\)|0)\s*;?\s*$/ const prevent = elm.getAttribute('prevent') - disposed = true - /** - * Give the chance to the listeners binding on doc or doc.body for - * handling the a-jump. - * Should set a _should_intercept_a_jump function on window to test - * whether we should intercept the a-jump. - */ - if (window._should_intercept_a_jump && window._should_intercept_a_jump(elm) - || href.match(voidHrefReg) - || prevent === '' || prevent === 'true') { - // do nothing. leave it to the intercept handler. + if (window._should_intercept_a_jump && window._should_intercept_a_jump(elm)) { + // e._triggered should not be true since we left the intercepter to handle the event. + e._triggered = false + e.preventDefault() + disposed = true } - else if (href) { - location.href = href + else if (href.match(voidHrefReg) + || prevent === '' || prevent === 'true') { + e._triggered = false + e.preventDefault() } - else if (process.env.NODE_ENV === 'development') { - console.warn('[vue-render] If you want to use the A tag jump, set the href attribute') + else { + e._triggered = { target: elm } + disposed = true // handled by default behavior for clicking on a element. } } + /** + * If the click handler is binding on a element inside a <a> element, + * then should prevent default. + */ + if (disposed && evtName === 'click' && isInANode(elm)) { + e._triggered = { target: elm } + e.preventDefault() + return + } + if (disposed) { return } http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/b7fa6b0f/package.json ---------------------------------------------------------------------- diff --git a/package.json b/package.json index 7176a73..cd90c76 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,7 @@ "subversion": { "browser": "0.5.0", "framework": "0.21.11", - "vue-render": "0.12.14", + "vue-render": "0.12.15", "transformer": ">=0.1.5 <0.5" }, "description": "A framework for building Mobile cross-platform UI", http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/b7fa6b0f/packages/weex-vue-render/README.md ---------------------------------------------------------------------- diff --git a/packages/weex-vue-render/README.md b/packages/weex-vue-render/README.md index 0554334..31646a2 100644 --- a/packages/weex-vue-render/README.md +++ b/packages/weex-vue-render/README.md @@ -172,6 +172,10 @@ vue: { * fix loading & refresh: pulling down wrongly triggered. +#### 0.12.15 + +* not to prevent default behaviour of click events unless the click-binding element is inside a `<a>` link, or it is a `<a>` link and has a `prevent` attribute on it. + ## component -> dom map | component | dom element | children | note | http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/b7fa6b0f/packages/weex-vue-render/package.json ---------------------------------------------------------------------- diff --git a/packages/weex-vue-render/package.json b/packages/weex-vue-render/package.json index b07535d..a08b4ce 100644 --- a/packages/weex-vue-render/package.json +++ b/packages/weex-vue-render/package.json @@ -1,6 +1,6 @@ { "name": "weex-vue-render", - "version": "0.12.14", + "version": "0.12.15", "description": "Weex built-in components for Vue 2.x.", "license": "Apache-2.0", "main": "dist/index.common.js",