event.path未定义Firefox和vue.js [英] event.path undefined with Firefox and vue.js

问题描述

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

我有一个问题与火狐：

我使用event.path [n] .id和与Firefox的我得到一个错误event.path undefined

但它工作罚款在其他浏览器。

你有什么想法为什么？

谢谢！ 解决方案

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

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

  var path = event.path || （event.composedPath&& event.composedPath（））; 
 if（path）{
 //你有一些路径信息
} else {
 //这个浏览器不提供路径信息
} 
  

显然，如果浏览器没有提供路径信息，就不会提供路径信息，方式和新的，标准的方式，所以将尽最大努力跨浏览器。

例子：

< div id =}}，false）;

，Firefox和IE11不支持路径或合成路径。 Chrome支持路径（这是Google最初的想法），但还没有（<）c $ c> composedPath 。

所以我不认为你可以得到Firefox或IE11的路径信息。 （没有测试Edge）。显然，你可以通过 e.target.parentNode 获得路径，每个后续的 parentNode 相同，但当然是路径 / 合成路径是不是总是是相同的（如果在事件被触发之后，但在你的处理程序被调用之前修改了DOM）。


First I am using vue-js. and NodeJs

I have a problem with firefox:

I use event.path[n].id and with firefox I got an error "event.path undefined"

But It work fined in other browser.

Did you have any idea why?

Thank you!

解决方案

The path property of Event objects is non-standard. The standard equivalent is composedPath, which is a method. But it's new.

So you may want to try falling back to that, e.g.:

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

Obviously that won't give you path information if the browser doesn't supply it, but it allows for both the old way and the new, standard way, and so will do its best cross-browser.

Example:

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>

In my tests, Firefox and IE11 don't support either path or composedPath. Chrome supports path (it was Google's original idea) but not (yet) composedPath.

So I don't think you can get the path information on Firefox or IE11. (Didn't test Edge.) You can, obviously, get the path via e.target.parentNode and each subsequent parentNode, which is usually the same, but of course the point of path/composedPath is that it's not always the same (if something modifies the DOM after the event was triggered but before your handler got called).

这篇关于event.path未定义Firefox和vue.js的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！