如何快速定位dom写在哪个vue文件中

最新推荐文章于 2024-04-23 15:38:18 发布

新阿伟先生

最新推荐文章于 2024-04-23 15:38:18 发布

阅读量572

点赞数

分类专栏：知识点文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/weixin_45022563/article/details/129022578

版权

知识点专栏收录该内容

19 篇文章 2 订阅

订阅专栏

在chrome调试工具中选中要寻找的元素

复制一下代码在Console中执行

(function () {
    var el = $0;
    while (el && !el.__vue__) el = el.parentNode;
    if (!el) return console.log("no vue");
    var vue = el.__vue__;
    do {
        var tag = vue.$options._componentTag;
        console.log(vue._vnode.tag + (tag ? `(${tag})` : ""), vue.$options.methods, vue.$el);
        vue = vue.$parent;
    } while (vue);
})();

代码会逐级输出组件名称、组件定义的methods、对应的dom节点