社区
其他技术讨论专区
帖子详情
devtools检查Vue组件的问题
weixin_38065750
2018-05-05 11:26:39
我在学习怎么调试vue的项目比较方便。 使用vue-cli生成的示例项目,然后使用devtools打开,在最下一级组件helloworld这个组件上面选择右键的inspect Vue component按钮。然后浏览器提示No Vue component was found。 这个应该怎么才能看到。 设置都是默认生成的。config/index.js的设置是devtool: ‘cheap-module-eval-source-map’
...全文
244
4
打赏
收藏
devtools检查Vue组件的问题
我在学习怎么调试vue的项目比较方便。 使用vue-cli生成的示例项目,然后使用devtools打开,在最下一级组件helloworld这个组件上面选择右键的inspect Vue component按钮。然后浏览器提示No Vue component was found。 这个应该怎么才能看到。 设置都是默认生成的。config/index.js的设置是devtool: ‘cheap-module-eval-source-map’
复制链接
扫一扫
分享
转发到动态
举报
写回复
配置赞助广告
用AI写文章
4 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
weixin_38098983
2018-05-08
打赏
举报
回复
weixin_38114442
2018-05-07
打赏
举报
回复
那个功能是类似「检查元素」来着,也就是在页面内容上点右键。Vue DevTools 本身也是基于网页的,所以右键菜单也会有检查元素之类的项。
weixin_38113341
2018-05-07
打赏
举报
回复
所以说,是应该在「页面」上点右键,而不是在 DevTools 里
weixin_38085230
2018-05-07
打赏
举报
回复
应该是和检查元素差不多。看按钮名称的意思应该是检查组件。不过,我就是奇怪检查不到组件,是要怎么配置才可以吗?还是我操作不对。你们有用过这个功能没有。要是能前端把组件调试一下,也是很爽的吧。
vue
-
devtools
_
vue
-
devtools
官网_
vue
devtools
chrome_
vue
-
devtools
_
3. **生命周期图表**:
Vue
组件
有特定的生命周期,
Vue
Devtools
提供了图表来展示这些生命周期事件的顺序,有助于理解
组件
何时被创建、更新或销毁。 4. **
Vue
实例信息**:显示关于当前选中
组件
的详细信息,包括它的...
devtools
_
vue
_6.1.4_chrome.cn chrome版本
devtools
_
vue
插件
2. **状态
检查
**:实时监控
Vue
实例的数据变化,当数据发生变化时,对应的
组件
会高亮显示,帮助开发者追踪数据流。 3. **时间旅行**:记录
Vue
应用中的所有状态变更,可以回放这些变更,以便于排查
问题
或查看历史状态...
Vue
.js
devtools
(
Vue
3开发者工具插件)
8. **
Vue
生态系统集成**:除了核心
Vue
框架,
Vue
3还与
Vue
x(状态管理库)、
Vue
Router(路由管理)等生态
组件
紧密结合,
devtools
也提供了相应的工具进行辅助。
Vue
.js
devtools
的最新版本6.0.0.21,针对Chrome浏览器...
vue
-
devtools
-5.4.3-chrome
在面板中,开发者可以查看当前页面中
Vue
组件
的树状结构,每个
组件
的状态和属性都可以通过界面直观地展现出来。此外,开发者还可以实时修改
组件
的数据,观察数据变化对UI的影响,也可以追踪
组件
的生命周期事件和...
vue
3-
devtools
这款工具极大地简化了
Vue
组件
、状态管理和生命周期的
检查
过程,使得开发人员可以更直观地理解应用的工作原理,从而提高开发效率。 在Chrome浏览器中,
Vue
3
DevTools
作为一个扩展程序运行,无需安装额外的依赖包,只...
其他技术讨论专区
477
社区成员
790,957
社区内容
发帖
与我相关
我的任务
其他技术讨论专区
其他技术讨论专区
复制链接
扫一扫
分享
社区描述
其他技术讨论专区
其他
技术论坛(原bbs)
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章