vue
JustDI-CM
对于可控的事情要保持谨慎,对于不可控的事情,要保持乐观,人只能做自己能力范围内的事情,你要接受这个现实,并且以乐观的心,去应对这一切
展开
-
element UI-表格数据上下移动功能
1.在<el-table>中增加一列 <el-table-column label="操作" > <template slot-scope="scope"> <el-button size="mini" type='text' :disabled="scope.$index == 0" @click.stop="sortUp(scope.$index, scope.row)">向上↑ </原创 2021-03-23 17:44:32 · 1652 阅读 · 0 评论 -
element UI-日期选择器(el-date-picker)-起止日期相差30天
1.需求:结束日期选择范围:开始日期-开始日期+30天2.实现:使用el-date-picker组件的picker-options属性,及picker-options中的disabledDate方法代码(style也在,可忽略):<template> <div class="medicalRecord"> <h3 class="...原创 2020-04-09 12:44:31 · 2656 阅读 · 0 评论 -
element UI-远程搜索(el-select)
1.需求表单项需具有搜索功能,并以下拉选的形式展现2.实现<template> <div class="medicalRecord"> <div class="main-content" v-if="!taskDetail"> <div class="content-top"> <el-fo...原创 2019-12-31 15:48:18 · 6892 阅读 · 1 评论 -
element UI-远程搜索(el-autocomplete)
1.需求表单项(系统名称)需具有搜索功能2.实现<template> <div class="publicBox"> <div> <div class="main-content"> <div class="content-top"> <...原创 2019-11-22 15:51:49 · 1310 阅读 · 1 评论 -
vue-使用websocket
1.需求项目有部分要求前后端实时交互2.实现前端使用websocket,直接上代码(只涉及websocket) let localHost = window.location.host console.log('localHost-----') console.log(localHost) let ws...原创 2019-09-24 09:31:38 · 2384 阅读 · 1 评论 -
element UI-级联选择器(el-cascader)
1.需求:form中营业单位需要展示一级单位及二级单位。2.实现:1)el-form中添加el-cascader<el-cascader style="width: 140px" :change-on-select="true" :props="defaultParams" :options="options" v-model="selectedOption...原创 2019-07-25 19:48:33 · 8371 阅读 · 0 评论 -
vue-公共方法
1.创建js可以在src文件下,创建一个文件夹放公共方法js2.定义方法export default { // 方法1 testMethod1: function () { console.log('对,我只是一个测试公共方法') }, // 方法2 testMethod2: function (val) { console.log('巧了,我...原创 2019-05-17 17:06:24 · 7255 阅读 · 3 评论 -
element UI-文字提示(el-tooltip)
1.需求:表格中某些单元格显示一个值,当鼠标hover时显示另一个值。1)获取数据时,处理表格数据2)在单元格中添加el-tooltip原创 2019-05-13 15:52:58 · 41458 阅读 · 0 评论 -
vue-实现文件下载
1.利用浏览器的导出功能window.location.href = 服务器文件路径相当于后端告诉前端文件的地址,直接使用浏览器去下载2.以流的形式下载文件查了一些资料,主要用的代码如下,原文章:入口在此基础上增加了params,以传参// 下载模板 handleExportTem () { this.btnSendTem = true ...原创 2019-05-15 14:37:03 · 66106 阅读 · 4 评论 -
element UI-时间选择器(el-date-picker)
1.实现只选择年份<el-form-item label="查询年份:" label-width="82px"> <el-date-picker style="width: 140px" v-model="formResult.year" type="year" ...原创 2019-05-09 18:26:01 · 9471 阅读 · 0 评论 -
element UI-上传文件(el-upload)
1.由于原生js实现的上传功能有些缺陷,暂时没有能力解决,所以尝试使用el-upload,直接上代码<el-upload class="upload-demo" action="https://jsonplaceholder.typicode.com/posts/"(不用管) accept=".xls,.xlsx"(文件格式,逗号分隔) ...原创 2019-04-24 15:09:35 · 9917 阅读 · 3 评论 -
vue-原生js实现文件上传
1.按钮通过ref触发input的上传功能<tk-button @click="handleUpLoad">点击上传</tk-button>(自定义标签)<input ref="inputUpLoad" style="display: none" type="file" accept="*" @change="handleFile"/>handle...原创 2019-04-24 15:00:27 · 4241 阅读 · 0 评论 -
element UI-远程搜索(el-autocomplete)修改下拉框的样式
记录实现改变下拉框的功能1.默认样式el-autocomplete下拉列表的宽度默认与输入框的一样。当远程搜索返回的字段过多时,部分字体会被掩盖。查看官方文档,发现popper-classpopper-class Autocomplete 下拉列表的类名 2.添加popper-class3.确定元素调试中发现,打包后的下拉列表是放在一个div中4.编写样式...原创 2019-04-10 11:09:04 · 13947 阅读 · 3 评论 -
error: vue-cli路Failed to download repo vuejs-templates/webpack: read ECONNRESET
vue-cli创建vue项目报错,上网百度原因也没找到个明白的。问了一个大佬,说可能是网络问题,然后切换了手机WiFi,果然成功了。可能是公司网络屏蔽了一些相关网站,导致下载webpack失败。在排错的过程中,发现了两篇创建vue项目过程写的很详细的博客,网址如下:https://blog.csdn.net/weixin_40760196/article/details/79952652...原创 2019-03-13 10:56:48 · 22755 阅读 · 7 评论 -
element UI-实现table分页回显和数据收集
1)table添加:row-key@selection-change2)多选列添加:reserve-selection="true"3)data中添加相关变量4)method中添加相关方法@selection-change="handleSelectionChange"handleSelectionChange (ary) { con...原创 2019-02-15 15:22:37 · 2708 阅读 · 0 评论