vue
关注
分享
扫一扫
文章平均质量分 64
凉茶冰
我不想被后浪拍在沙滩上。
展开
-
npm install遇到Unexpected end of JSON input while parsing near ‘...onnect“:“^2.0.0“,“gru‘问题解决
dataRT前端本地编辑及打包遇到的问题总结原创 2022-07-19 17:57:58 · 439 阅读 · 0 评论 -
this.$router.go(-1)遇到的一些问题记录
目录前提条件需求描述问题描述1 无法返回到列表2 无法渲染的页面3 无法关闭的新页签参考文献前提条件 目前有这样一个需求，在列表中，点击列表的某个记录，会直接进入到A页面假设为：http://localhost:8080/#/index/123，在A页面内部有以下元素：（1）一个返回按钮，通过this.$router.go(-1)返回，或者是window.close()直接关闭页面。（2）一个a标签的连接，点击之后页面跳转到http://localho...原创 2021-08-13 15:40:51 · 7175 阅读 · 0 评论 -
Vue的computed属性中方法带参数的写法记录
computed是计算属性，如果带参数怎么办？ 可以按照如下写法Vue.component("mulit-table-operation", { mixins: [mixin], template: `<span> <el-tooltip v-for="(item,index) in field" :conte...原创 2020-02-27 20:52:34 · 8711 阅读 · 0 评论 -
钉钉微应用关于better-scroll在click设置为ture仍然出现点击无效的问题记录
目录问题描述问题解决解决方案问题描述开发了一个钉钉微应用，关于列表使用了better-scroll来实现下拉刷新上推加载更多，整体实现效果还是不错，参考这里。钉钉微应用分为手机端和PC端，项目中使用了同一套代码。测试的时候发现都正常，但是经过多次测试，发现一个问题：（1）偶尔会出现在PC端列表无法下来，而且点击也无效的情况。使用鼠标上下拖拽的时候不会响应相关事件，会出现把列表...原创 2019-11-13 11:39:57 · 713 阅读 · 0 评论 -
VUE中关于this.$nextTrick()的记录
目录问题描述实现思路我的理解问题描述项目中有这样一个需求，页面中有一个textArea输入框，当输入相关字符，例如：下划线_，#、{的时候，会自动有一个弹框，弹框中是输入框，让输入相关内容，按下回车键，相关内容会进行转换追加到textArea中。要求是默认进入页面textArea自动获取焦点，弹框的时候，弹框中的输入框自动获取焦点。实现思路使用elementUI的...原创 2019-10-24 10:12:50 · 3647 阅读 · 0 评论 -
ElementUI出现的Invalid prop: custom validator check failed for prop "index"错误
问题描述使用NavMenu组件时候，通过循环读取菜单信息来展示菜单列表。在进行了相关处理之后，菜单可以正常展示，但是控制台一直告警，报：Invalid prop: custom validator check failed for prop "index"的异常，如下所示：出现这个问题之后，查看代码中的index处理，如下：这样写，貌似是正确的，但一直告警。解决方法in...原创 2019-10-11 23:47:25 · 8724 阅读 · 2 评论 -
axios关于QS序列化的记录
目录axios中常规请求问题1问题2关于后台综上参考文献axios中常规请求如果手工全局指定Content-Type为application/x-ww-form-urlencoder，如下：//post请求的Content-Typeaxios.defaults.headers.post['Content-Type'] = 'application/x-www...原创 2019-03-07 11:52:10 · 4405 阅读 · 0 评论 -
vue-cli工程中config/index.js中assetsPublicPath路径配置问题记录
config/index.js中关于bulid打包时候默认assetsPublicPath是‘/’看到不少人都说要改成‘./’，不然打包后的项目找不到js、css、图片这些信息。对这一块的理解一直比较模糊，这里记录下。assetsPublicPath是配置为相对路径还是绝对路径，取决于你打包后前端资源怎么发布部署。假如说，你把index.html以及static文件夹直接放到...原创 2019-03-19 14:33:05 · 9028 阅读 · 1 评论 -
Vue-Grid-Layout分享一款好用的可拖拽组件
在使用Grafana的过程中，发现Grafana关于视图页面中每一个面板都可拖拽，可随意放大放小，体验非常棒，F12看了Grafana的代码，看打包后的代码很像react，进一步css，看到有grid layout的字眼，然后尝试去搜了下有没有这方面的组件，一搜果然是有这样的组件的。首先看到的是react版本的组件，然后搜了下也有vue相关的。以前也见过jquery的可拖拽组件demo，但是整体...原创 2019-04-02 14:29:11 · 10573 阅读 · 3 评论 -
VUE之组件的动态注册和动态加载
目录问题描述项目中的应用使用总结问题描述实际项目中，针对不同的数据开发了不同的数据展示视图组件，例如：拓扑图、热力图、地图。每一类视图都有一个独立的.vue组件，在界面化管理平台上，要实现可以动态的新增视图组件，同时修改的时候可以随意的修改选择那一类视图。而且随着项目的扩大，基础视图组件的也会随之增加，即：基础视图组件的个数是不固定的。这就要求在界面化操作配置视图时，我们可...原创 2019-05-13 23:15:51 · 15447 阅读 · 3 评论 -
VUE项目中关于F5刷新的一些记录
目录前言问题描述问题分析问题解决总结前言基于vue-cli脚手架开发的单页应用有他特殊的特点和优势。因为是单页应用，所以在进行F5刷新的时候和之前常规的html页面还有区分。主要区别在于，vue-router接管了浏览器的前进、后退、刷新等事件，通过对相关事件的监听，动态的操作popstate,pushstate,replacestate等api来完成浏览器url的变化...原创 2019-05-16 10:16:21 · 8908 阅读 · 1 评论 -
Vux-ui中如何修改组件的全局样式
vux的每一个组件有样式变量的定义但是一直不知道怎么去使用，其实使用起来很简单。在src下面编写一个less文件，然后修改webpack.base.conf.js中相应代码theme.less文件是新建的主题文件，在这个文件中去修改相关组件中提到的相关样式即可这是theme.less中对先关样式变量进行重写。刷新页面，然后你就发现组件的默认样式被调整了。参考文献...原创 2019-03-01 16:40:05 · 1269 阅读 · 0 评论 -
idea下搭建基于vue-cli的框架
目录1.准备工作2.创建工程3.生成项目4.配置idea5.安装babel-polyfill6.安装axios7.全局方法8.参考文献1.准备工作先安装好nodejs和npm，安装方法不再赘述，网上有很多教程。使用如下命令查看是否安装成功node -vnpm -v如下图则为安装成功如果没有翻墙工具，最好安装阿里的cnpm镜像，以免出现...原创 2019-02-12 23:42:50 · 1376 阅读 · 0 评论 -
vue-cli引入bootstrap时候图标不显示
问题描述：vue-cli项目引入bootstrap的css的时候，样式都正常，但是发现图标无法正常显示，有些特殊字体也无法正常显示，F12查看提示找不到对应的字体文件，再具体一看，发现路径不对，多了static/css。解决办法：build->utils.js文件中，找到 vue-style-loader,添加publicPath:'../../'。如下：再重新打包发布...原创 2019-01-30 16:49:36 · 3212 阅读 · 0 评论 -
VUE学习记录
在尝试了解了React和Vue之后，还是选择了Vue作为开发前端web的单页应用的框架，主要是vue相对来说还简单容易理解一些。通过断断续续的两周学习和准备，现在基本对vue的开发有了一个比较深入的认识。Vue最核心的魅力就在于双向绑定，可以让我们专注于数据，而不用管dom。之所这样说，是因为，只要数据改变了，页面就实时的调整改变了，这也之前使用jquery进行dom操作完全是两个概念。我觉...原创 2018-09-30 11:15:29 · 528 阅读 · 0 评论 -
基于better-scroll的下拉刷新上推加载更多
目录前言项目中使用的截图如下封装better-scroll组件的使用 后续前言本来想使用vux的scroller组件，但是看到官方说不在维护了，而且在提供的样例里面，虽然例子有可以自定义加载等待区域以及文字提示的内容，但是实际上却没有找到相关样例代码，改来改去也改不成想要的样子。。。最后放弃了。在网上查了很多，后来发现better-scroll这个插件就...原创 2018-12-04 15:37:55 · 1108 阅读 · 1 评论 -
vue项目的跨域处理及发布部署
目录前言1.开发模式下的跨域处理2.打包发布和后台服务一块部署3.使用nginx发布前端项目前言 本篇主要是记录下再开发vue项目时遇到的跨域问题，那么什么是跨域呢，可以简单理解为，我请求A服务的资源，A服务的资源里面又有向B服务发起的情况存在，这就是跨域。这是浏览器的同源策略限制决定的。这里插一句，我以前以为认为跨域请求是浏览器不允许发送请求，但是，实际测试的...原创 2018-12-04 16:44:17 · 4676 阅读 · 0 评论 -
Vuex页面F5被刷新后，state内容全部丢失的问题解决
问题：页面如果被F5强制刷新了，那么store.state里的内容就会被清空。这显然不是我们所希望看到的。结合localStorage缓存可以解决该问题。在main.js中绑定下页面刷新事件，如果有刷新事件，则把store.state内容存入缓存。然后在root.vue的create方法中去重新加载。具体代码如下：1.工具代码setObj: function (key, ...原创 2018-11-30 17:57:28 · 3557 阅读 · 0 评论 -
前端路由和后端路由的对比及优劣
前言本篇主要从web应用中页面跳转方式来说明目前web开发技术中常见的两种页面路由方式及对应的技术，然后根据不同的路由方式对应的技术来阐述不同技术的优劣以及在我认为未来web开发的技术发展趋势。路由什么是路由？提到路由，可能第一反应是无线路由器，但这里的路由指的是页面跳转的规则，我们常见的网站，从A页面跳转到B页面是如何定义的，页面内容如何回显，这些都可以算作是web路由的一部分。路由...原创 2018-12-03 14:16:37 · 6315 阅读 · 1 评论 -
vue单页应用前进刷新后退使用缓存的实现
目录前言问题场景一、页面A->页面B->页面C二、页面A->页面B->页面C->页面B解决方案(1) keep-alive时限前进刷新后退使用缓存(2)结合vuex实现前进刷新后退使用缓存注：前言vue-cli创建的创建结合keep-alive可以实现页面缓存的效果。但是，在实际的使用过程中，发现后退返回使用缓存，前进进入也是使...原创 2018-12-03 15:17:55 · 5428 阅读 · 1 评论 -
vue关于router.replace历史路由问题记录
问题描述A->B->C，C->B，在B中使用this.$router.go(-1),预期期望是返回到A页面，但是实际是又返回了C页面去了。C页面提交通过this.$router.push跳转到B页面，在B页面使用go(-1)的话则会重新返回到C页面。在网上查了下，提到的大多数解决方案都是使用this.$router.replace，即替换当前页面的方式，就不会生成历史...原创 2018-12-03 15:27:50 · 15865 阅读 · 6 评论 -
vuex使用经典入门
在网上看到的，记录在这里。https://segmentfault.com/a/1190000012881956https://segmentfault.com/a/1190000009404727这两个写的都非常通俗易懂！转载 2018-12-03 15:56:44 · 180 阅读 · 0 评论 -
vue-cli按需引入element-ui
按照element-ui官方提供的步骤一步一步调整，最后可能会报错，对应不同错误，有如下不同的执行方式：如果报错Module build failed: Error: Couldn't find preset "es2015" relative to directory 则执行cnpm install babel-preset-es2015 --save-dev报错These depe...转载 2018-12-27 11:36:00 · 594 阅读 · 0 评论 -
idea中vue-cli项目js文件中关键字高亮显示
新建了一个项目之后，发现js的一些关键字和方法不高亮显示，也无法通过快捷键点击进去，原因是没有开启Node.js Core library。file --setting--Languages&Frameworks---Node.js and NPM,点击 Enable即可。如下效果为正常效果：...原创 2019-02-14 18:50:08 · 2294 阅读 · 0 评论 -
关于idea中提交svn时一直显示performing VCS refresh
vue前端项目会自动生成node_modules文件夹，在首次上传版本到svn的时候，不要提交node_modules文件夹，否则node_modules文件也会在版本控制中，那么在npm install之后，灾难就来了，Version Control的Local Changes中会一直扫本地变更的文件，node_modules中新增的成千上万的文件就会一直扫，这是造成提交svn时一直显示perf...原创 2018-10-08 17:52:32 · 34329 阅读 · 7 评论