vue
建行一世
闲出病来
展开
-
vue修改数据后,页面不重新进行渲染的问题(当点击其他页面元素会重新渲染数据)
问题最近开发项目时,遇到一个非常特殊的问题(以前也遇到过但都用很多乱七八糟的方式解决了!),这个问题就是当我在methods的某一个方法中修改了页面v-for的数据时,本应该重新渲染的页面没有响应,还是维持老样子,当我点击页面上的其他组件时,页面才重新渲染出来。给大家看一下就是下面这个效果。下面这两个,是点击其他组件时又成功渲染出来的样子。原因这里说一个概念,在组件初始化的时候,对data中的某一个数组进行递归遍历,会对数组中数据的每一个属性进行劫持,添加set,get方法。我们后来.原创 2021-06-22 17:53:23 · 3578 阅读 · 0 评论 -
vue脚手架项目禁用页面浏览器回退与前进功能(完整且通用)
举例:我这里有两个页面,分别如下,由登录signin页面点击进入到layout页面。现在需要禁用如下浏览器回滚页面:步骤一在main.js中加入如下代码:window.addEventListener('popstate', function() { history.pushState(null, null, document.URL)})步骤二今天router下的index.js文件。在const router = new Router({})中加入如下代码:const ro原创 2021-03-25 15:13:03 · 458 阅读 · 0 评论 -
在vue2.6项目中拓展集成vxe-table组件教程
环境:vue2.61. 安装xe-utils vxe-tablenpm install xe-utils vxe-table注: xe-utils是vxe-table的依赖环境,需要一并安装。2.添加main.js import Vue from 'vue' import VXETable from 'vxe-table' import 'vxe-table/lib/index.css' Vue.use(VXETable)注: 部分人安装时可能会出原创 2021-01-26 15:08:01 · 4578 阅读 · 5 评论 -
vue-draggable组件教程:可拖拽滑动控制多列表的组件(类似SAP日报功能)
介绍draggable是一款基于Sortable.js实现的vue拖拽插件。支持移动设备、拖拽和选择文本、智能滚动,可以在不同列表间拖拽、不依赖jQuery为基础、vue 2过渡动画兼容、支持撤销操作。安装1.首先,你需要有一个由vue-cil创建的vue项目,我这里使用我的一个开源前端进行展示,需要可自取。传送门然后执行如下命令。yarn add vuedraggable 或者 npm i -S vuedraggable出现下图信息即为完成。2.创建一个用于展示的页面并引入dragga原创 2021-01-15 11:10:51 · 3702 阅读 · 3 评论 -
简简单单实现一个大文件分片上传+断点续传(java springboot+vue vue-simple-uploader)
大文件分片思路这里先大致说一下开发环境与背景和交代一下思路,由于笔者看教程是就不喜欢看那些没用的前言,所以我尽量长话短说。开发环境本次教程的例子是我用之前写的一个微服务中使用的文件系统做的,前端使用的是vue2.6,其中前端上传组件使用的是vue-simple-uploader。后端使用springboot2.2.7与springmvc思路前端依靠vue-simple-uploader组件只需要稍微配置一些参数即可轻松实现,后面会以代码形式体现,这里不多说了。后端的实现主要是需要一个entity实原创 2020-08-04 10:19:46 · 7086 阅读 · 43 评论 -
Linux下将vue打包成docker部署在NGINX中 图文最全
首先我们需要准备好一个vue项目,一个Linux服务器,Linux服务器上需要安装docker(安装教程我就不多说了),这些准备好之后就来跟着步骤试一下吧一、打包vue项目首先我们又这样一个项目,在该项目的路径中run build一下,打包成一个dist文件这时,我们可以看到目中多出了一个dist文件,这就是打包好后的项目文件。二、配置docker本地打包工具先将docker放到我...原创 2020-04-30 17:16:37 · 1243 阅读 · 1 评论 -
mockjs与vue-simple-uploader(大文件分片上传)同时使用报错!
PS:报错信息找不到了,因为有的早,当时忘了截图了上个星期写项目时要在系统中引入大文件分片上传组件vue-simple-uploader,结果各种报错(报错图丢了)原因就是mockjs与vue-simple-uploader有冲突,去掉其中一个就好了,如果非要使用假数据的话JSON-server也可以试试!...原创 2020-03-24 16:25:31 · 746 阅读 · 1 评论 -
启动vue项目报错ERROR:npm vue-template-compiler@2.6.10包版本问题
报错部分代码error in ./src/views/freeManage/publish/flowPay.vueModule build failed: Error:Vue packages version mismatch:vue@2.6.10vue-template-compiler@2.6.10报错原因package.json与package-lock.js...原创 2020-03-04 11:36:46 · 3025 阅读 · 0 评论 -
输入npm install 报错node-sass@4.13.1 postinstall:`node scripts/build.js` -Failed at the node-sass@4.13.0
报错信息报错原因这是因为node-sass源因为异常出错,需要重新配置node-sass的源解决办法install之前先进行如下操作即可npm config set sass_binary_site=https://npm.taobao.org/mirrors/node-sass...原创 2020-03-04 11:32:16 · 2004 阅读 · 1 评论 -
elementui中树(le-tree)动态刷新选项
今天项目中出现一个问题,需要让el-tree组件动态的刷新选中内容,官方给出的是这样的例子:但是我自己试了试并不管用,然后摸索了半天发现,还需要在组件上加一个这个:menuses是动态选中的那一组数据,也是在this.$refs.tree.setCheckedNodes(this.menuses);中放入的用于动态刷新的数据组...原创 2020-03-02 10:53:43 · 2066 阅读 · 0 评论 -
分享一个前端管理系统的架子,vue-web-os,仿Windows10操作系统云桌面
前言(请允许我抒发一下情感)前几天老大突然要搞一个OA系统,也就是我们自己公司用的办公软件,打算整的花里胡哨一些,当时老大看上了一个仿Windows的云桌面,我本来是不打算弄这个的,感觉这种东西花里胡哨,不适合快速开发,但是毕竟“上有命,下不得不为之”,我绝对起手整一个。但是从git上找遍了许久都没有发现类似项目,外面找的也是收费的,唯一找到的一个技术老的可怜,都停止维护了,于是开始自己做...原创 2020-02-20 18:41:11 · 3881 阅读 · 10 评论 -
分享几个毫秒值转换成字符串格式的方法,vue
将毫秒值转换为普通的日期格式 yyyy-MM-ddformatDate(time) { const myTime = new Date(time) const yyyy = myTime.getFullYear() let MM = myTime.getMonth() + 1 if (MM < 10) { MM = '0' + MM } let dd =...原创 2020-01-15 16:28:49 · 941 阅读 · 0 评论 -
Element-UI Popconfirm组件调用事件
今天更新了项目中的elementui到2.13.0的版本了,发现多了一个很漂亮的Popconfirm组件,但是使用上出现了一个问题,那就是代码按照API实现了,但是却找不到可以实现相应的事件函数:点击好的并没有什么事件,已开始想到将@click放到里面的button上,发现也不行,于是网上搜了下源码才找到解决办法:在Popconfirm标签中添加@onConfirm="pop(“1”)或者@...原创 2019-12-30 10:50:28 · 14025 阅读 · 12 评论 -
vue中使用百度地图API写一个简单的组件(一)
这里先说明一下,像这种地图组件,个人感觉做成个组件比较合适,当然也可以直接写进页面里,就是复用性差一些。一、打开百度地图API官网,创建秘钥点击这里打开官网下滑浏览器,找到JavaScriptAPI。点击进去,里面便是开发文档,可以根据这里的开发文档使用。想快速构建的还是留在这里看我的吧!点击申请秘钥去申请一个秘钥,具体步骤请看这里二、配置vue环境1、在index.html中添加百...原创 2019-12-25 15:10:32 · 667 阅读 · 0 评论 -
element-ui表格中文字中含<br>进行换行
为了适应多种前端,后端给文字换行可能会直接在一串字符中加入<br/>来达到换行的目的,最近使用elementui中的table表格时,发现直接将这个表签加入文字中无法识别,像下面这个样:这里是前端表格中的数据,带有换行符的字段是timeTemperature <el-table v-show="lbbool" :data="weathers" :current-row...原创 2019-12-17 15:19:31 · 6218 阅读 · 1 评论 -
写了一个关于JavaScript中获取今天,昨天明天等纯字符串日期的函数
首先奉上代码GetDateStr(AddDayCount) { var dd = new Date(); dd.setDate(dd.getDate()+AddDayCount);//获取AddDayCount天后的日期 var y = dd.getFullYear(); var m = dd.getMonth()+1;//获取当前月份的日期 var d = dd.getDate();...原创 2019-12-16 16:47:16 · 347 阅读 · 0 评论 -
npm install报错(npm ERR!errno 1) install 一个版本较低的项目时报错
具体报错信息如下npm ERR!code ELIFECYCLEnpm ERR!errno 1npm ERR!node-sass@4.9.2 postinstall: node scripts/build.js npm ERR!Exit status 1 npm ERRnpm ERR!Failed at the node-sass@4.9.2 postinstall script. np...原创 2019-12-05 10:38:41 · 1184 阅读 · 1 评论 -
element-ui升级后某些页面直接卡死,el-tabs组件引起的错误
今天遇到一个非常恶心的错误。因为想用element-ui2.12.0中的某些icon组件,所以升级了一下element-ui的版本。从2.3.4直接升级到了2.12.0,没想到程序上线后某些页面点击直接卡死,前端系统直接出问题,打开network查看后发现一个JS加载不出来导致的。随后在网上找了很多答案一:使用element-ui里面的组件时,要用 包裹起来在用就可以了,像这样<el-...原创 2019-11-21 09:56:11 · 2791 阅读 · 0 评论