1. 安装chrome插件:Vue.js devtools(https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd?hl=zh-CN)
 
2. 下载vue-devtools (https://github.com/vuejs/vue-devtools)
3. 修改文件:vue-devtools-master/shells/chrome/manifest.json
1
2
3
4
"background": {
        "scripts": [ "build/background.js" ],
        "persistent"false
    },
改成:
1
2
3
4
"background": {
        "scripts": [ "build/background.js" ],
        "persistent"true
    },
4. 打开vue项目,在控制台选择vue:
 
5. 可操作组件查看信息变化(例如分页组件)
 选择第一页:
 
 
 选择最后一页:
 
 
 
 

vue的测试(Vue.js devtool)的更多相关文章

  1. 【原】无脑操作:Chrome浏览器安装Vue.js devtool

    学习Vue.js时,Chrome浏览器安装Vue.js devtool能很方便的查看Vue对象.组件.事件等. 本文以Chrome浏览器插件Vue.js devtools_3.1.2_0.crx的安装 ...

  2. Vue.js devtool插件下载安装及后续问题解决

    在中国,你是无法使用谷歌应用商店,所以你下载插件,要使用一些别的手段,一种是下载源码编译,另一种是通过第三方网站.第一种不适合小白,所以现在介绍第二组. 下载插件网站 国外网站:https://www ...

  3. Vue.js devtool插件安装后无法使用的解决办法

    初次使用Vue.js devtool插件的新人在安装了Vue.js devtool插件后,都会经常有一个疑问.我在chrome浏览器里面已经成功安装好Vue.js devtool插件,怎么点击后提示v ...

  4. Vue 浅谈前端js框架vue

    Vue Vue近几年来特别的受关注,三年前的时候angularJS霸占前端JS框架市场很长时间,接着react框架横空出世,因为它有一个特性是虚拟DOM,从性能上碾轧angularJS,这个时候,vu ...

  5. [Vue] karme/jasmine/webpack/vue搭建测试环境

    karma 和 jasmine karma 是 google 开源的一个基于 Node.js 的 JavaScript 前端测试运行框架,前身叫 Testacular. jasmine 是一个 jav ...

  6. 【Vue】转-Vue.js经典开源项目汇总

    版权声明:本文为EnweiTech原创文章,未经博主允许不得转载. https://blog.csdn.net/English0523/article/details/88694219 Vue是什么? ...

  7. vue中config/index.js:配置的详细理解

    当我们需要和后台分离部署的时候,必须配置config/index.js: 用vue-cli 自动构建的目录里面  (环境变量及其基本变量的配置) var path = require('path') ...

  8. Vue CLI及其vue.config.js(一)

    有时候我们为了快速搭建一个vue的完整系统,经常会用到vue-cli,vue-cli用起来很方便而且命令简单容易上手,但缺点是在构建的时候我感觉有一些慢,因为CLI 服务 (@vue/cli-serv ...

  9. Atom 编辑器安装 linter-eslint 插件,并配置使其支持 vue 文件中的 js 格式校验

    安装方式有如下几种. 1.最常用的安装方式. # 进入atom插件文件夹 cd ~/.atom/packages/ # git clone 插件源文件 git clone https://github ...

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

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

随机推荐

  1. Web Api初试

    Web Api初试 前言 ASP.NET Web API 与之前的内建HTTP服务解决方案的不同之处在于,它一开始就是围绕HTTP协议及其消息语义构建起来的.与WCF REST或ASP.NET AJA ...

  2. json-smart 使用示例

    json-smart 使用示例 json是一种通用的数据格式.相比与protocal buffer.thrift等数据格式,json具有可读性强(文本).天生具备良好的扩展性(随意增减字段)等优良特点 ...

  3. 查找算法---find运算,find_first_of的使用

    查找算法---find运算,find_first_of的使用 一.find运算 假设有一个int型的vector对象,名为vec,我们想知道其中是否包含某个特定值. 解决这个问题最简单的方法时使用标准 ...

  4. Winform DataGridView CheckBoxColumn c# 单选 解决方案

    这个问题由来已久,我最近在工作中也遇到了这个问题,不过属于这个问题比较简单初级的涉及. 发现网上对这个问题的解决方案很多不对,答非所问. 所以这里将我测试成功的解决方案记录下来. 首先,DataGri ...

  5. hdu2534-Score

    http://acm.hdu.edu.cn/showproblem.php?pid=2534 由题知, 每一个数据都可以由ax +by组成: ax1 + by1 - c x2 a - d y2 == ...

  6. DEV 打印gridcontrl

    private void PrintPreview(DevExpress.XtraPrinting.IPrintable gridControlPrint)         {             ...

  7. Markdown写作

    What is markdown? Markdown 是一种轻量级的「标记语言」,它的优点很多,目前也被越来越多的写作爱好者,撰稿者广泛使用.看到这里请不要被「标记」.「语言」所迷惑,Markdown ...

  8. CSS预处理器的对比 — Sass、Less和Stylus

    本文根据Johnathan Croom的<sass vs. less vs. stylus: Preprocessor Shootout>所译,整个译文带有我们自己的理解与思想,如果译得不 ...

  9. EF 下的code fist 模式编程

    EF 分两种模式 codefirst(就是不知道数据是啥,也没有数据库)  和 database fist (数据已经设计好了) 首先打开vs  新建一个项目 创建一个控制台程序 然后 新建一个Tea ...

  10. Bootstrap实现弹出框和提示框效果代码

    一.Bootstrap弹出框使用过JQuery UI应该知道,它里面有一个dialog的弹出框组件,功能也很丰富.与jQuery UI的dialog类似,Bootstrap里面也内置了弹出框组件.打开 ...