- 博客(18)
- 收藏
- 关注
RSS订阅原创 在Element UI中使用Select,子组件中的下拉框加载更多数据
在element Ui中使用Select组件时,如果后端返回的数据量过大,我们需要做上拉加载更多,前提是后端进行了分页处理1.首选获取滚动条的高度创建一个js文件,获取滚动条高度// directives.js import Vue from 'vue' Vue.directive('selectLoadMore', { bind (el, binding) { // 获取element-ui定义好的scroll盒子 const SELECTWRAP_DOM = el.qu
2020-11-26 18:27:04
1535
3
原创 在子组件中Cannot read property ‘setCheckedKeys‘ of undefined
在父组件中有一个dialog子组件,在子组件中有权限列表如图所示现在要求可以修改,点击修改的时候,角色所拥有的权限要求回显 this.$nextTick(()=>{ this.$refs.tree.setCheckedKeys(this.resourceCheckedKey) })使用element ui给出的方法,还是报错了去网上查了,结果说是dom数没来得及渲染,就要预勾选,所以报错了,然后说加this.nextTick,道理我都懂,但是我是单独做了一个子组件的
2020-11-05 14:45:05
639
3
原创 在vue中使用iview让在modal中的表格上拉加载更多-PC
最近有一个需求,表格不使用分页展示了,要求下拉加载更多的数据,让其一页展示(使用的是iview)说明一点,并不是使用的Scroll无限滚动因为会在外面再加一个滚动条,与需求不服1.获取元素关于获取元素这一点真的是个巨坑总所周知获取元素的方法有两种document.getElementById系列与document.querySelector系列这两个获取元素的返回值是不一样的上图很清除的看见两者返回的数据差别因为一个返回的是静态的vnode一个是动态的,所以一定要用document.getEl
2020-10-17 11:54:47
746
原创 使用element ui表格合并列数据渲染的问题
element ui的合并列在项目中多多少少会用到表格,而在表格中有这样的表格某一列是合并的,根据官方给出来的代码前提是得把表格正常渲染出来,复制element ui 的官方文档就可以了,如何需要在前面加上编号,我是这样做的 rowspan () { this.tableData.forEach((item, index) => { if (index === 0) { this.spanArr.push(1) this.p
2020-10-09 10:19:38
774
原创 在vue中点击回车登录
在项目中需要加一个小功能,不用点登录框,直接回车就能登录,1.@keyup事件在输入框上面加keyup事件 <input @keyup.enter="submit">如果使用element 的<input @keyup.enter.native="submit">这种方法具有很大的局限性.需要获得input框的焦点(focus)才能够正常触发,不然就会失效2.document.addEventListener监听keyup事件语法如下element.addEve
2020-09-25 15:33:10
912
1
原创 关于element ui导航菜单中二级菜单中页面跳转菜单高亮的问题
1.一级菜单高亮如果只有一级菜单,使用官方给的方法即可:default-active="$route.path"2.二级菜单高亮关于二级菜单高亮的问题,不得不说走了很多坑,试了很多中方法,最常见的 let defaultMenu = window.location.hash.substr(window.location.hash.indexOf("/")); this.activerouter = this.$route.path;截取当前路劲上的地址,然后在赋值给高亮属性,
2020-09-09 19:16:06
3751
8
原创 js中的排序算法
js中的排序算法1.冒泡排序元素两两对比,值较小的数往前面排for (let i = 0; i < arr.length ; i++) { for (let j = 0; j < arr.length-1; j++) { //相邻元素对比 if (arr[j] > arr[j+1]) { let temp = arr[j+1] arr[j+1] = arr[j]
2020-09-03 18:53:58
108
原创 关于element ui中autofocus属性失效的问题
1丶需求进入页面默认选中其中一个按钮,当跳转到其他页面返回的时候默认选中之前选中的按钮于是马上就想到了element ui中的autofocus属性,添加,然后就发现以下报错,自动对焦被阻止,果然是没那么简单嗯?被阻止了不慌,手动触发来一手这里就不得不提一个很厉害的东西,自定义指令vue中directives,详情请看官方文档-自定义指令然后你就会看到这样一段代码directives: { focus: { // 指令的定义 inserted: function (
2020-08-26 17:14:23
5291
原创 echars请求数据渲染的问题
在项目中把echars图标画好了,之后还得处理数据渲染的问题,当把数据拿到了之后应该怎么渲染呢首先我想的是直接复制给data xAxis: { type: 'category', data:this.datatime },为什么会直接赋值给data,是因为之前自己弄了一个时间轴,直接赋值是可以渲染的,但是似乎这次,不太行,其实后来想想也想到原因了 mounted() { console.log(this.datatime)
2020-08-25 16:23:32
154
原创 echars横向柱状图的设置
最近的项目用上了echars图表,遇到了一些问题,记下来以后方便查看1.首先第一个问题****竖型柱状图变成横型柱状图的问题(图一)代码如下option = { xAxis: { type: 'category', data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, yAxis: { type: 'value' }, series: [{
2020-08-17 11:55:53
2070
原创 单独设置body的背景颜色-H5页面
当我看到两个不同背景颜色的时候,什么东西,能做吗,后来面向百度编程,发现了答案首先#app里面的背景颜色是#ccc beforeCreate() { document.querySelector('body').setAttribute('style', 'background:#fff') }, beforeDestroy() { document.querySelector('body').removeAttribute('style') }, 在所需要的
2020-08-10 11:51:43
1536
原创 使用Vant中Field 输入框的问题
最近在移动端的项目中,使用vant输入框的时候发现了一个问题,如图点击输入框的时候会出现选择框,第一次见这东西,太迷糊了,就连elements元素上都找不到原本以为是type的原因没想到是name的原因应该没人会跟我一样吧…难受移动端项目的vant框架问题...
2020-08-07 11:13:05
9841
6
原创 与element ui结合省市区三级联动
与element ui结合省市区三级联动首先需要的肯定是数据了,自己搜索了一下,无外乎就是json数据,这就到了第一个问题,如果你有数据只是不知道怎么样引入在vue中如何引入json文件首先你得需要一个json格式的文件.例如a.json,你还需要创建一个b文件,例如叫b.js,是一个js文件,再然后你的在你的页面引用吧那就c.vue,引用关系为在js中引用json,在vue中引入js首先在b中引入aimport a from ‘./a.json’ 然后导出 export default a
2020-07-30 16:58:42
1505
原创 vue中的环形数据图
最近项目有一个需求,要求画出一个数据环形图类似于这种,旁边有百分比值,刚开始想到的是使用echars来做,毕竟人家方便,而且快,找了很久没找到符合的模板,只能自己写一个了,当然了,也是收集了很多资料的首先来看一下代码<template> <div class="overall"> <div class="annulus-box"> <div class="plan"> <span>{{ plan }}%
2020-07-22 12:03:48
1649
原创 微信扫码登录redirect_uri参数是什么
微信扫码登录过程中所遇到的问题最近有个一需求,相信很常见,是一个在登录页扫码登录,然后跳转首页,以及在其他页面绑定和解绑微信号最开始项目起步,在项目里用的是用插件即vue-wxlogin 方便快捷,后面就是配置的问题了首先appid,直接复制粘贴即可其次遇到的第一个坑点redirect_uri的参数应该填什么,为什么会报错自己找了很多文章方法,其中大多是检查微信回调域名,看看是否加了http://,但是我觉得很多人应该是和我一样的,并没有报错,而且并不知道参数应该填什么,怎么写,这个时候可以尝试
2020-07-08 16:54:36
6768
原创 使用element ui的table组件时,修改当前列出现的bug
在使用elementUi做后台管理系统的时候,都会涉及到数据的增删改查,其中在table中修改当前页的时候会遇到一下问题,当你想修改当前页的数据时你会发现页面数据同步修改了,想想没什么问题,甚至还觉得特别好,然后就是点击确定发请求给接口也修改成功了!然后就是点击取消的时候,你会发现!!即使你不调用接口,表格中的数据依然会改变这时候才觉得事情似乎不对劲,那造成这种情况的原因是什么呢?其解决方法应该要怎样呢?器是造成这种情况原因是因为地址引用与值引用的原因,上一个页面把当前列的数据用对象的形式传到弹
2020-06-28 18:55:28
384
原创 使用element ui的一些小问题
使用element Ui 中的Dropdown 下拉菜单时的小bug当我们写一个页面的时候,或多或少会用到下拉菜单,特别当你写的是后台管理系统的时候,而你刚好用了element ui库,下面来看示例这是正常状态,非常完美,可视当你做页面缩放适配的时候,他就会发生改变,例如这样他也随着页面的缩小而发生了变形这时候我们需要控制他的样式了,他的宽度不够,那我们就给他一个小最小宽度这样就可以完美解决了仅记录工作中不易发现的小bug...
2020-06-18 11:22:19
164
1
原创 在table表格中使用element的switch组件
关于在element ui中使用switch遇到的问题在使用element ui中会遇到这样的需求,在表格中插入switch,在页面加载的时候,switch的状态也会随着数据的不同而发生改变
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人