vue
Little_Pig_Bug
一只满身带着BUG,也要飞的猪猪侠
展开
-
Chrome调试Vue插件devtools
之前一直没用过,只是看到过别人在用,今天有空,自己安装了下,发现还是有点意思的。。。。1.下载安装包,地址https://github.com/vuejs/vue-devtools,或者你直接用git下载,cd到你下载的目录,然后执行命令 git clone https://github.com/vuejs/vue-devtools,我是直接去git上下载安装包的,然后解压,项目目录如下...原创 2018-08-04 16:34:10 · 1539 阅读 · 0 评论 -
解决Chrome 本地调试vue,Sources下找不到源代码的问题
先看一下,我在Sources下的代码情况,代码都是已经编译过得了,导致我本地无法调试我的代码,明明之前可以在webpack下找到我的代码的,后来查了下,原来是config下index.js配置问题。解决方法:config/index.jsdev:{ devtool: 'cheap-module-eval-source-map', }重新运行vue后,即如下...原创 2018-10-16 14:33:33 · 20371 阅读 · 4 评论 -
Downloading https://chromedriver.storage.googleapis.com/2.40/chromedriver_win32.zip
npm install chromedriver --chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver原创 2018-10-10 16:37:01 · 3083 阅读 · 0 评论 -
Module build failed: Error: ENOENT: no such file or directory
Module build failed: Error: ENOENT: no such file or directory, scandir 'C:\projects\men-config\node_modules\node-sass\vendor'在我启动npm run dev 的时候,报上面的错,看到node-sass有问题,重新安装就好了npm rebuild node-sas...原创 2018-10-10 16:45:42 · 17952 阅读 · 0 评论 -
vue 实现全屏和退出全屏的功能
<span class="icon-contain" @click="getFullCreeen"> <svg-icon icon-class="quanping" /></span>JSexport default { name:'topHeader', data(){ return{ ..原创 2018-10-29 14:32:20 · 10129 阅读 · 1 评论 -
小程序&前端项目缓存解决方案 转至元数据结尾
小程序篇 背景: 在开发小程序的时候遇到本次发布的更新在用户的手机微信客户端上显示的还是老板本的项目,导致了用户不能使用,必须要在工作人员的引导下清除微信缓存货刷掉小程序的进程才能够正常使用.本来我们开发小程序的目的是为了让用户更快的使用我们产品减少对员工的依赖,但是此次遇到的缓存问题不能降低我们使用成本反而加大了工作人员的不便. 在过后根据讨论以及取经得出了一下...原创 2019-01-10 17:18:20 · 1080 阅读 · 0 评论 -
获取浏览器的地址
1.获取http协议:window.location.protocol2.获取一个页面的主机名和端口号相当于是hostname和port:window.location.host所以浏览器的地址是window.location.protocol+'//'+window.location.host...原创 2019-03-07 16:49:58 · 1835 阅读 · 0 评论 -
vue实时获取页面的宽度,自适应屏幕
data(){ return{ fullWidth:document.documentElement.clientWidth } }, created(){ window.addEventListener('resize', this.handleResize) }, beforeDe...原创 2019-03-11 20:37:55 · 26060 阅读 · 1 评论 -
element Pagination切换分页条数,会出现两次请求
场景:分页条数分别是20/50/100条,默认20条的时候,一共有83页,100条的时候,一共有17条数据。当我点到83页查看页面数据,页面的请求是pgSize: 20,pgNum: 83当我切换到100条的时候,页面出现了两次数据查询,其实我页面就写了一次请求。后来分析,我觉得应该是element自己的问题,当我从20切换100的时候,其实页面已经没有了84页了,但是此时页面...原创 2019-03-11 21:09:53 · 3980 阅读 · 1 评论 -
element-ui 时间的格式化
之前格式化一直用自己写的格式化方式,也看到过安装moment,都感觉挺麻烦的,看到过element-ui的format,但是今天才知道这个用法,value-format="HH:mm:ss",年月日的自动前面添加前缀。...原创 2019-08-01 13:54:33 · 1081 阅读 · 0 评论 -
[Vue warn]: Failed to mount component: template or render function not defined.
首先问题定位在我引入的两个组件AddDialog,EditDialog上面,这两个组件的目录结构如下其中我要在我的父组件timeConfig引入上面两个字组件,我的代码引入如下import AddDialog from './addDialog/index'import EditDialog from './editDialog/index'正确的写法应该如下:impor...原创 2019-08-22 20:20:03 · 383 阅读 · 0 评论 -
vue + express + mongoose项目构建,简单测试
承接我之前的一篇文章,https://blog.csdn.net/Little_Pig_Bug/article/details/82712986,使用的是同一个后台项目myappmongoose我们可以理解他是Oracle和mongodb的一个混合产物1.安装mongoose,cd进入myapp文件夹C:\projects\myapp>npm install mongoose ...原创 2018-09-17 16:12:45 · 529 阅读 · 0 评论 -
vue打包后过滤console.log和debugger
vue-cli搭建的项目在build下的webpack.prod.conf.js下添加如下代码 new webpack.optimize.UglifyJsPlugin({ compress: { warnings: false, drop_console: true, drop_debugger:true },...原创 2018-09-17 14:00:09 · 3865 阅读 · 2 评论 -
vue中slot-scope的使用
vue在2.5版本以后,貌似就将slot改为slot-scope了,刚开始对他的感觉就是,这个有啥作用啊,基本就瞟了一眼他的定义就过去了,后来在项目中发现他的作用还挺大的。基本用法//父组件<template> <div class="father"> <h3>这里是父组件</h3> <tes...原创 2018-08-09 19:01:06 · 6267 阅读 · 1 评论 -
删除node_modules文件
方法一:npm install rimraf -grimraf node_modules1 2方法二:rmdir /s/q your_app_dir1方法三:rm -f /node_modules转载 2018-08-01 09:17:42 · 495 阅读 · 0 评论 -
vue的ref属性的相关介绍
操作习惯了DOM,在用vue操作数据时,我们开始常常很不习惯,但是用ref,我们可以将他绑定在想要操作的元素或者组件上,从或者他们的DOM。下面的例子我们都是在vue-cli搭建的项目下,运行的。1.获取元素的DOM<template> <div> <input placeholder="请输入内容" ref="inputs" /> <...原创 2018-08-01 11:11:20 · 1235 阅读 · 0 评论 -
配置proxyTable,将mock请求地址指向本地,本地模拟Mock数据
之前模拟数据,一直是在本地新建json文件,然后将请求的地址指向本地的json路径,但是这样往往不能模拟Post的请求方式,再加上现在的项目都是vue的,就想到了使用Mock,但是中间环境的配置,让我苦恼了好久,记录下来,以防以后自己又忘记了!下面的都是以Vue项目为例讲解。。。。。配置Mock环境1.在项目的根目录下新建mock文件夹,将我的本地的testApi的json文件放在下面(...原创 2018-08-14 18:50:46 · 4339 阅读 · 1 评论 -
the "scope" attribute for scoped slots have been deprecated and replaced by "slot-scope" since 2.5.
之前用vscode运行vue项目,在vscode里面报错(Emitted value instead of an instance of Error) the "scope" attribute for scoped slots have been deprecated and replaced by "slot-scope" since 2.5. The new "slot-scope" att...原创 2018-08-07 16:03:49 · 1991 阅读 · 0 评论 -
Element-ui实现图片上传和表单提交功能,打开表单弹框,显示上传图片
<el-upload class="upload-demo" accept="image/jpeg,image/jpg,image/png" name="img" ref="img" action="/help/upload" :file-list="fileList" :on-error="h原创 2018-08-17 10:41:07 · 10227 阅读 · 1 评论 -
Vue中$watch的简单应用和理解
watch<template> <div> <div class="form_line"> <label>用户名:</label> <input v-model="info.name" placeholder="请输入用户名&quo原创 2018-08-20 09:50:48 · 931 阅读 · 0 评论 -
ERROR command failed: npm install --loglevel error --registry=https://registry.npm.taobao.org --di
vue-cli 3.0构建vue 项目时,报错如下: > [email protected] install C:\vueDemo\myproject\node_modules\chromedriver> node install.jsDownloading https://chromedriver.storage.googleapis.com/2.41/chrome...原创 2018-08-20 10:39:11 · 19969 阅读 · 4 评论 -
vuex的state,gettters,mutations,actions学习笔记
最近自己用vue全家桶写了一个微商城,下面我们将以这个讲解我的学习过程,截取部分代码。具体请看https://github.com/LitterPig/test-vueApp想要使用他们,首先得安装vuex,所以第一步就是安装vuex了。。。。。。1.安装vuex,会在我们的package.json里面的dependencies看到vuex安装信息npm install vuex ...原创 2018-09-04 14:51:04 · 931 阅读 · 0 评论 -
关于mapState,mapGetters,mapMutations,mapActions的学习笔记
说白了mapState,mapGetters,mapMutations,mapActions 其实就是对state,gettters,mutations,actions的重命名而已。1.mapState他是对state的对象进行二次计算,他可以简化我们代码,这样我们获取cartList,不用写this.$store.state.cartList一大串了,尤其对于我们组件中用到次数挺多的情况...原创 2018-09-04 17:08:07 · 9426 阅读 · 0 评论 -
vue 路由跳转时,导致页面样式错乱的问题
最近遇到一个问题,当我页面路由跳转时,跳转后的页面的排版错位了,后来发现是跳转后的页面的样式代码在跳转前的页面里面已经被加载过了,而且我在每个组件页面里面写的style,都没有加上scoped,这种情况下,跳转后页面的样式会沿用了前一个页面的样式,导致页面错乱。解决办法:在跳转前和跳转后页面的style上加上scoped但是我项目用的是mint-ui框架,我的组件里面用了mint-ui的组...原创 2018-09-05 11:19:52 · 9559 阅读 · 10 评论 -
谷歌浏览器怎么看到http版本
按f12,刷新页面,重新发送请求,找到Network--->Response Headers--->view source原创 2019-09-23 13:31:26 · 17615 阅读 · 8 评论