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. ACM 位运算

    的幂 boolean power2(int x) { return((x&(x-1))==0)&&(x!=0): } For example: #include<stdi ...

  2. Python-数据库支持

    10.Python-数据库支持 使用数据库的好处: a.支持数据的并发访问,多个用户同时对基于磁盘的数据进行读写而不造成任何文件的损坏: b.支持根据多个数据字段或属性进行复杂的搜索: 1.如何操作数 ...

  3. 实战 ASP.NET MVC Web API

    实战 ASP.NET MVC Web API Web API 框架基于 ASP.NET MVC 框架开发,是一个面向 Http 协议的通信框架.相对于 WCF 而言,Web API 只面向于 Http ...

  4. 一种基于自定义代码的asp.net网站首页根据IP自动跳转指定页面的方法!

    一种基于自定义代码的asp.net网站首页根据IP自动跳转指定页面的方法! 对于大中型网站,为了增强用户体验,往往需要根据不同城市站点的用户推送或展现相应个性化的内容,如对于一些大型门户网站的新闻会有 ...

  5. Tapestry5.3使用总结

    1.Tapestry框架的加载是通过Filter来完成的,需要在web.xml中加入以下配置: <filter> <filter-name>app</filter-nam ...

  6. .Net程序员学用Oracle系列(7):视图、函数、过程、包

    <.Net程序员学用Oracle系列:导航目录> 本文大纲 1.视图 1.1.创建视图 2.函数 2.1.创建函数 2.2.调用函数 3.过程 3.1.创建过程 3.2.调用过程 4.包 ...

  7. 使用Freemarker创建word文档

    最近做一个项目,本来是直接在网页上查看文本信息,然后给客户直接打印的,但是发现也许是浏览器还是打印机的原因,总之,有个客户打印出来的格式始终与其他的不同,没办法,最后想到了直接将数据库中的信息生成一个 ...

  8. Android第二天

    1.从看得见的活动入手 protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); ...

  9. java基础练习 5

    import java.util.Scanner; public class Fifth { /*输入数组,最大的与第一个元素交换,最小的与最后一个元素交换,输出数组.*/ public static ...

  10. 使用java连接MySql,中文乱码解决的方法

    排查MySql中文乱码的问题 1.在cmd中启动MySql. 打开命令提示符cmd,输入"mysql -uusername -ppassword",回车,就可以连接到数据库. 如输 ...