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. PXE：另类方式启动 centos live

    default menu.c32 timeout 1 label centos76-live-by-other menu label centos76-live from ftp by other k ...

  2. RTX临界段,中断锁与任务锁

    临界段         代码的临界段也称为临界区,一旦这部分代码开始执行,则不允许任何中断打断.为确保临界段代码的执行不被中断,在进入临界段之前须关中断,而临界段代码执行完毕后,要立即开中断.    ...

  3. 删除JS 对象属性（元素）

    var a={"id":1,"name":"danlis"}; //添加属性 a.age=18; console.log(a); //结果: ...

  4. Golang知识图谱

    原:https://www.processon.com/view/link/5a9ba4c8e4b0a9d22eb3bdf0?from=timeline 百度脑图重制:http://naotu.bai ...

  5. C++对windows控制面板的操作

    经常碰到程序无法卸载, 就老是骂微软搞的什么安装方式,安装好了不能卸载. 后来就打算研究一下windows是如何卸载程序的,一个程序安装完后留下了什么信息用于后面的卸载. 研究对象win7 64位, ...

  6. F - Currency Exchange

    来源poj1860 everal currency exchange points are working in our city. Let us suppose that each point sp ...

  7. 我的WafBypass之道（Misc篇）

    先知技术社区独家发表本文,如需要转载,请先联系先知技术社区授权:未经授权请勿转载.先知技术社区投稿邮箱:Aliyun_xianzhi#service.alibaba.com: Author:Tr3je ...

  8. python语法_使用占位符进行格式化输出

    “%s”   占位符 name = input("name:") age = input("age:") job = input("job:" ...

  9. Luogu 1031 - 均分纸牌 - [有意思的思维题]

    题目链接:https://www.luogu.org/problemnew/show/P1031 题目描述有 $N$ 堆纸牌,编号分别为 $1,2,…,N$.每堆上有若干张,但纸牌总数必为 $N$ 的 ...

  10. 深入学习C#匿名函数、委托、Lambda表达式、表达式树类型——Expression tree types

    匿名函数 匿名函数(Anonymous Function)是表示“内联”方法定义的表达式.匿名函数本身及其内部没有值或者类型,但是可以转换为兼容的委托或者表达式树类型(了解详情).匿名函数转换的计算取 ...