Vue devtools 插件

一、安装

去这下载https://chrome.zzzmh.cn/

打开chrome的扩展程序

再打开开发模式

把刚才下载的拖到这里

然后把它固定到工具栏

就是这样了。

二、使用

程序通过open on live server后,打开开发者工具,找到vue就可以了。

这是代码

html 复制代码
    <div id="app">
        <h1>{{msg}}</h1>
    </div>
    <div id="app2">
        <h1>{{msg}}</h1>
    </div>
    <script>
        const myVue = new Vue({
            data: {
                msg: 'Hello Vue'
            },
            el:'#app'
        })
        new Vue({
            data: {
                msg: 'Test'
            },
            el:'#app2'
        })
    </script>
相关推荐
这个一个非常哈10 分钟前
element之,自定义form的label
前端·javascript·vue.js
阿东在coding25 分钟前
Flutter 测试框架对比指南
前端
李瑞丰_liruifengv27 分钟前
Claude Agent SDK 最简玩法:几行代码配合 Markdown 轻松搭建 Agent
javascript·人工智能·程序员
是李嘉图呀29 分钟前
npm推送包失败需要Two-factor权限认证问题解决
前端
自己记录_理解更深刻30 分钟前
本地完成「新建 GitHub 仓库 react-ts-demo → 关联本地 React+TS 项目 → 提交初始代码」的完整操作流程
前端
借个火er31 分钟前
Chrome 插件开发实战:5 分钟上手 + 原理深度解析
前端
攀登的牵牛花32 分钟前
前端向架构突围系列 - 架构方法(一):概述 4+1 视图模型
前端·设计模式·架构
Hashan32 分钟前
Vue 3 中 v-for 动态组件 ref 收集失败问题排查与解决
前端·vue.js·前端框架
bobringtheboys34 分钟前
[el-tag]使用多个el-tag,自动判断内容是否超出
前端·javascript·vue.js
ccccc__34 分钟前
基于vue3完成领域模型架构建设
前端