vue 在浏览器控制台怎么调试 谷歌插件vue Devtools

问题： vuejs里面的变量，怎么用浏览器的console查看？

例如，想在chrome里用console.log查看变量$data，会显示undefined。

解决方案:

再main.js里面声明window.Vue = new Vue

window.Vue = new Vue({
el: '#app',
router,
store,
components: { App },
template: '<App/>'
})
在浏览器控制台里面用Vue代替this就可以了

vue 在浏览器控制台怎么调试 谷歌插件vue Devtools的更多相关文章

  1. 浏览器控制台命令调试——console

    控制台命令调试时通过浏览器开发工具中的控制台命令嵌入到JavaScript中,输出特定的信息或日志,从而达到调试的目的. 我们常用的Chrome和FireFox,都可以通过F12来打开开发工具. 下面 ...

  2. chrome浏览器的VUE调试插件Vue.js devtools

      chrome浏览器的VUE调试插件Vue.js devtools 应用商店直接安装 安装成功后在VUE文件打开可以直接调试: 提示效果如下: F12进入调试状态即可: 安装中出现的问题: 插件安装 ...

  3. vuejs-devtools浏览器调试chrome插件

    vuejs-devtools浏览器调试chrome插件(360极速浏览器也可以安装,需要FQ)https://chrome.google.com/webstore/detail/vuejs-devto ...

  4. 关于安装了Vue-devtools插件但在浏览器控制台不显示的解决方案

    Google浏览器中开发调试的时候,右上角出现vue的图标,但是在开发者工具中没有出现vue调试(已在扩展程序中安装 Vue Devtools) 控制台却没有. 错误原因: 没显示调试工具的原因是用了 ...

  5. 不依赖浏览器控制台的JavaScript断点调试方法

    随着浏览器的逐渐强大,绝大多数情况下的代码调试都是可以通过浏览器自带的一些调试工具进行解决.然而对于一些特殊情况仍然无法享受到浏览器的强大 调试能力,比如QQ客户端内嵌web的调试(虽然说QQ目前已经 ...

  6. 从零开始系列之vue全家桶（2）安装调试插件vue Devtools

    小白安装前提是会用git,会从github上找东西. 第一步: 我们可以先从github上找到vue-devtools的项目,下载到本地.下载vue-devtools链接. 克隆方法:git clon ...

  7. 1.Google Chrome浏览器 控制台全解析

    Google Chrome浏览器 控制台全解析 在Google Chrome浏览器出来之前,我一直使用FireFox,因为FireFox的插件非常丰富,更因为FireFox有强大的Firebug,对于 ...

  8. 利用谷歌插件破解今日头条的新闻ajax参数加密，新手都能懂

    最近在学习谷歌插件,想找个项目练练手,就拿今日头条开刀 首先访问地址是:https://www.toutiao.com/c/user/50025817786/#mid=50044041847 通过抓包 ...

  9. Vue安装及插件Vue Devtools

    vue安装: # 最新稳定版 $ npm install vue # 全局安装 vue-cli $ npm install --global vue-cli # 创建一个基于 webpack 模板的新 ...

随机推荐

  1. pointcut 切面表达式 切入点表达式

    下面给出一些常见切入点表达式的例子. 任意公共方法的执行: execution(public * *(..)) 任何一个以“set”开始的方法的执行: execution(* set*(..)) Ac ...

  2. 并发编程基础之wait以及notify的用法

    一:概念 线程通信中经常用到wait和notify,顾名思义,wait即让当前线程处于等待状态,notify通知锁对象 上的另一个线程被唤醒,这里的唤醒是指可以去争夺锁资源,nofityAll是唤醒该 ...

  3. 获取mssqlserver数据库表的字段名称，字段说明，数据类型，主键等表的信息

    sql脚本: SELECT TableName then d.name else '' end,---表名 TableShowsThat then isnull(f.value,'') else '' ...

  4. CentOS 6.x 如何升级 glibc 2.17

    CentOS 6.x 如何升级 glibc 2.17 ldd --version rpm -qa | grep glibc #查看glibc的版本 strings /lib64/libc.so.6 | ...

  5. RecyclerView+SwpieRefreshLayout（转载）

    开源库BaseRecyclerViewAdapterHelperhttp://blog.csdn.net/xiangzhihong8/article/details/52138669http://ww ...

  6. 133、 Android 自动化测试（转载）

    Android 自动化测试--要点概括http://blog.csdn.net/vshuang/article/details/40595233 A/B测试与灰度发布http://blog.csdn. ...

  7. Linux块设备IO子系统(一) _驱动模型

    块设备是Linux三大设备之一,其驱动模型主要针对磁盘,Flash等存储类设备,块设备(blockdevice)是一种具有一定结构的随机存取设备,对这种设备的读写是按块(所以叫块设备)进行的,他使用缓 ...

  8. iowait

    https://www.cnblogs.com/fuyuanming/articles/6497005.html

  9. Redis 主从配置(Windows版)

    安装从库 1.复制一份 Redis 文件,当做从库. 2.修改从库文件中 redis.windows.conf 的端口号. 3.安装服务,需要重新设置名称.然后去服务中,开启“redis6380”(此 ...

  10. table中内容过长，table改变的问题

    在看效果时发现在Chrome中的table已经不是原来设置的宽度了,而其他浏览器是好的,经过百度发现是单元格内容过多造成的,但这时候给td设置宽度已经不适用了,此时就要给table设置 table{t ...