roury-CSDN博客

原创 ElementUI-table切页保存已勾选和被取消勾选（附默认选中）

期待实现效果：1. 后端返回数据中带被选中列表项的``id集``，在此``id集``的默认选中；2. 除了``被选中项id``，还要保存``被取消选中项id``，切页后依然保留

2022-02-17 14:20:34 1126

原创 element table根据后端数据合并行

效果数据格式

2021-08-26 17:58:44 752

原创 element侧栏固定，header固定，main主体可以滚动

需求利用elementui的Container 布局容器，布置一个有顶部header，侧边栏aside以及主体main，现要求当主题长度过长时可以滚动，但是顶部和侧边固定。思路主体main设置:指定高度height: calc(100vh - 61px) //61px为顶部header盒子高度，并允许垂直滚动overflow-y: auto;详解布局代码：<el-container class="operation-wrapper"> <el-header cl

2021-07-01 17:04:53 1730 1

原创 ElementUI的NavMenu 导航菜单水平展开左侧菜单时，默认打开子菜单（open方法：手动打开子菜单）

文章目录情景知识点htmljs效果情景ElementUI的NavMenu 导航菜单model为vertical（默认）时，可以通过控制collaspe来控制菜单的水平折叠与展开，但是开启折叠的时候子菜单是关闭状态，现在是希望水平展开菜单的同时，子菜单也是展开状态知识点open方法：this.$refs.menu.open(index)html<el-menu ref="menu" router :class="minBoxRight ? 'left-menu' : '

2021-04-30 14:54:12 3532

转载 css水波纹-雷达扩散效果

css水波纹-雷达扩散效果：代码解析：第一个div是扩散出发点，不做动画处理；给后3个div设置相同的动画：放大并变淡，各自设置延迟；3.设置动画属性 animation-timing-function: linear;，同时最后一个div延迟时间等于动画时间（animation-duration==animation-delay(最后一个div)），保持均匀变化；html:<div class="circleBox"> <div class="circle"&g

2021-04-19 00:51:59 5225

原创 Echart柱状图数值显示

一.常规方法series配置项添加属性label二.xAxis中加了一个类目轴的配置（数字在同一高度）

2021-03-05 22:10:59 15042

原创 elementUI table 获取已勾选的行的数据

文章目录方法一：主要用到el-table的selection-change事件函数方法二：主要用到el-table的select和select-all事件函数方法一：主要用到el-table的selection-change事件函数优点：简洁明了缺点：如果存在分页，进入别的分页，selection清空html<el-table size="mini" :v-loading="loading.table" :data="listResult" :row-key="getRowkey" @s

2021-01-20 11:38:46 15500 3

原创 vue修改页面数据不渲染---this.$set()的使用方法

前情提要：以下三种情况Vue 不能检测数组和对象的变化对象中 property 的添加或移除：testObj.a='参数' //testObj没有参数a使用索引直接设置一个数组项：testArray[1]='数组项'修改数组长度：testArray.length = 4此时就需用使用this.set()/this.$set()来保证他们的响应性。(vm.$set是全局Vue.set方法的别名)一. 用法this.$set( target, key, value )，其中：target.

2021-01-08 17:31:47 1600

原创 vue组件传参

父组件传参<create-time-count :key="createTimeTimer" :test="testData"/>data() { return { //testData: 12312312,//number // testData: '字符串',//string // testData: {obj: '对象'},//object // testData: ['数组'],//object // testData: true,//

2021-01-08 15:55:18 4384

转载 vue路由跳转已打开页面不刷新数据

一.原因：vue-router的切换不同于传统的页面的切换。路由之间的切换，其实就是组件之间的切换，不是真正的页面切换。这也会导致一个问题，就是引用相同组件的时候，由于参数不一样不会覆盖原打开的页面而会打开一个重复的页面，只是页面的数据不一样，再点开旧的页面时(B.1)发现数据还是新页面(B.2)的数据，点开旧页面(B.1)时不会调用created()，mounted()函数，会导致获取数据的函数无法调用从而该组件无法更新。已知：父组件A页面跳转方式：this.$router.push({ pa

2020-12-09 17:36:59 2528

原创微信小程序过滤器 filter的使用-格式化数据函数封装

1.传输数据与显示数据不同时，可以使用过滤器改变数据显示格式：wxs2.封装数据格式函数，在多个js文件引用：js

2020-11-30 18:03:04 778

原创 vue项目中echart自适应高度--根据容器大小（宽度同理）

vue项目中echart自适应高度–根据容器大小（宽度同理）HTML<template> <el-row :gutter="32" id="content" style="height:90%"> <div id="backPerson" :class="className" :style="{height:height ,width:width}" /> </el-row></template>JS:根据content的

2020-11-30 10:45:02 7652 2

原创 ElementUI组件样式修改--表格背景透明，去除下横线（附：组件决定性class名（待整理验证，不完全正确））

修改elementUi（甚至其他ui组件库）的组件样式

2020-10-16 11:34:44 3740

原创织梦--图片集-列表顺序显示不正确及修改图片权重

图片集-列表顺序显示不正确原因：图片权重设置混乱解决：从1开始设置图片权重即可解决但是织梦5.7默认原系统是没法修改图片权重的，需要修改文件修改图片集图片权重找到织梦根目录下的dede文件夹的 album_edit.php文件，在149行左右，找到如下这一段代码：//更新数据库的SQL语句 $query = " UPDATE `#@__archives` SET typeid='$typeid', typeid2='$typeid2', sortrank=

2020-09-29 10:09:36 301 1

转载织梦--dede让channelartlist标签支持currentstyle属性

1.修改：打开include\taglib\channelartlist.lib.php搜索如下代码$pv->Fields['typeurl'] = GetOneTypeUrlA($typeids[$i]);在此行代码下方增加以下代码：if($typeids[$i]['id'] == $refObj->TypeLink->TypeInfos['id'] || $typeids[$i]['id'] == $refObj->TypeLink->TypeInfos['top

2020-09-29 10:06:56 203

原创 vue点击图片查看大图的几种方法

一.使用插件vue-directive-image-previewer二.使用elementui组件image的属性--previewSrcList

2020-09-28 11:05:46 12679 2

转载 js数组操作（去重，排序）

数组去重，数组排序

2020-09-18 17:20:03 439

原创 react入门小项目（ant design，路由，mock和axios）

一、配置环境搭建脚手架：全局安装create-react-app：npm install -g create-react-app此时，默认安装了初始化项目：npm init安装依赖包：npm install -S react react-dom babel-standalone create-react-appreact 核心库react-dom 与dom相关的功能...

2020-09-18 17:12:18 666

原创百度地图生成器

网页中引入百度地图

2020-09-18 16:40:57 1292

原创 vue页面跳转（带参数，附：``$route``和``$router``及其配置的区别）✔

1.使用标签<router-link to="/dashboardC"> <el-button type="text" icon="el-icon-arrow-left" ></el-button></router-link>2.使用this.router.push()带参数（推荐！）html:<el-button type="text" @click="toDetail(list)"></el-button&g

2020-09-07 11:50:12 277

原创 js时间格式转换

文章目录1.获取日期对象：2.日期对象转时间戳:3.时间戳转日期对象：4.字符串转日期对象'4.1:2020-02-23'4.2:'2020/02/23'4.3:'2020,02,23'4.4:不符合现实逻辑的时间2020年2月30日，它将被解释成3月2日。5.日期对象转时间字符串：2020-03-01 00:00:006.时间戳和时间字符串互转ps1:直接使用new Date()获取日期对象：ps2：获取时间戳的三种方式ps3：全部代码段1.获取日期对象：time = new Date() //Mon

2020-08-31 18:17:23 11646

得之我幸