event.path未定义Firefox和vue.js

首先，我正在使用vue-js。 和NodeJs

我有一个与Firefox的问题：

我使用event.path [n] .id和firefox我得到一个错误“event.path undefined”

但它在其他浏览器罚款。

你有什么想法，为什么？

谢谢！

Answer 1

Event对象的path属性是非标准的。 标准的等价物是composedPath ，这是一种方法。 但它是新的。

所以你可能想回到那个，例如：

 var path = event.path || (event.composedPath && event.composedPath()); if (path) { // You got some path information } else { // This browser doesn't supply path information } 

显然，如果浏览器没有提供path信息，就不会给你提供path信息，但是既可以采用旧的方式，也可以采用新的标准方式，这样就可以做到最好的跨浏览器。

例：

 document.getElementById("target").addEventListener("click", function(e) { // Just for demonstration purposes if (e.path) { console.log("Supports `path`"); } else if (e.composedPath) { console.log("Supports `composedPath`"); } else { console.log("Supports neither `path` nor `composedPath`"); } // Per the above, get the path if we can var path = e.path || (e.composedPath && e.composedPath()); // Show it if we got it if (path) { console.log("Path (" + path.length + ")"); Array.prototype.forEach.call( path, function(entry) { console.log(entry.nodeName); } ); } }, false); 

 <div id="target">Click me</div> 

Answer 2

如果它没有在浏览器中实现，你可以创build你自己的合成path函数：

 function composedPath (el) { var path = []; while (el) { path.push(el); if (el.tagName === 'HTML') { path.push(document); path.push(window); return path; } el = el.parentElement; } } 

返回的值相当于Google Chrome的event.path。

例：

 document.getElementById('target').addEventListener('click', function(event) { var path = event.path || (event.composedPath && event.composedPath()) || composedPath(event.target); }); 

Answer 3

该函数充当Event.composedPath()或Event.Path

 function eventPath(evt) { var path = (evt.composedPath && evt.composedPath()) || evt.path, target = evt.target; if (path != null) { // Safari doesn't include Window, but it should. return (path.indexOf(window) < 0) ? path.concat(window) : path; } if (target === window) { return [window]; } function getParents(node, memo) { memo = memo || []; var parentNode = node.parentNode; if (!parentNode) { return memo; } else { return getParents(parentNode, memo.concat(parentNode)); } } return [target].concat(getParents(target), window); }