（18）Vue DevTools插件

一、Vue DevTools插件介绍

Vue DevTools插件是 Vue.js 官方提供的用来调试 Vue 应用的工具。

二、Vue DevTools插件安装

安装地址如下：

https://chrome.zzzmh.cn/#/index 

在插件官网中搜索插件名称，然后下载。

点击下载后，会下载一个压缩文件，我们解压一下文件。 

将解压后的文件拖拽进来，然后点击添加拓展程序即可。 

如下图是安装插件成功页面 

三、Vue DevTools插件注意事项

• 网页必须应用了 Vue.js 功能才能看到 Vue DevTools

• 网页必须使用 Vue.js 而不是 Vue.min.js，否则无法使用此插件！ 

• 网页需要在 http 协议下打开，而不是使用 file 协议本地打开。

使用服务端口的方式打开！不要使用本地文件方式打开！否则插件无法使用！

 

这样我们修改我们的vue实例中的数据，是不是方便多啦！不需要我们去将实例存到变量中，再通过变量名操作里面的内容啦！！