- 博客(23)
- 收藏
- 关注
原创 间接使用封装好的el-table时,插槽如何使用
场景:Page需要使用PageLayout组件,PageLayout中使用了封装好el-table的组件Table,现需要给表格中的cell添加点击事件,所以需要插槽来进行传值。组件PageLayout。
2022-08-05 15:49:52
885
2
原创 iframe总是跳转到到内部项目根目录(iframe内外通信)
问题:开发项目过程中,需要使用iframe嵌套另一个项目,但是跳转到iframe中时经常跳转到目标项目的根目录。思路:使用iframe内外通信,将目标页面的路径从外部项目传入到内部项目,当跳转到内部项目根路径时,内部项目重定向到一个特定页面并在该页面内接收传进来的目标路径,获取到目标路径后再跳转到指定页面。步骤:①外部页面使用iframe并传入目标页路径<div style="height: 100%" v-loading="iframeLoading"> <i
2022-03-30 17:45:15
785
原创 封装el-table
封装组件<template> <!-- 表格分页 --> <div class="table_box"> <el-table :data="tableData" style="width: 100%" :border="border" :header-cell-style="{background:'#f6f9ff'}" :cell-class-name="cellStyle"> <el-table-column type=
2022-03-28 17:18:28
377
原创 使用ElementUi解决滚动条占位问题
使用el-scrollbar结合transition标签包裹需要滚动的dom<section class="app-main "> <el-scrollbar class="app_scrollbar"> <transition name="fade-transform" mode="out-in"> <keep-alive :include="cachedViews"> <router-view
2022-03-28 17:03:30
1685
原创 获取地址栏参数
function getQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); let str = window.location.href.split("?")[1] var r = str.match(reg); if (r != null) return decodeURI(r[2]); return null;}//调用方法获取
2022-02-18 10:48:01
322
原创 股权穿透图(直线连接节点、动态关系线、自适应居中布局)
<template> <div> <div class="container" id="treecontainer"> <div class="menu"> <div id="product_tree" class="treeWrap"></div> </div> </div> </div></template><.
2021-09-03 13:56:42
5684
6
原创 Jquery实现城市选择(省市联动)省市数据
var area = [ { data: [ { data: [ { name: '北京', }, { name: '海淀区', }, { name: '朝阳区', }, { name: '东城区', }, { name: '西城区', }, { name: '崇文区', }, {
2021-05-17 16:54:59
1546
原创 两种方法解决子组件修改父组件传入的值。(Computed property “xxx“ was assigned to but it has no setter.)
需求:子组件需要修改父组件传入的checkList,开发时尝试使用了compouer,情况并不乐观。修改前代码:·父组件<template> <div> <SelectPanel :title="productConfig.title" :optionList="productConfig.optionList" :checkList.sync="productConfig.checkList" /> <
2021-04-22 16:28:48
428
原创 vue数据改变页面不会及时更新
1.watch监听到数据的变化但页面没有刷新在数据改动的代码后加 this.$forceUpdate();添加this.$forceUpdate();进行强制渲染,效果实现。因为数据层次太多,render函数没有自动更新,需手动强制刷新。2.没有监听到数据的变化例如:改变了数组中的某一项或者改变了对象中的某个元素时,监听则未生效。数组若要触发监听,下面方法即可触发如:splice(),push() 等js方法当然了,也可以使用vue中的方法 this.$set(object, index,
2021-03-08 15:33:59
976
原创 手写微信小程序tab选项卡(过渡效果)
效果如下:<view class="barTitle"> <view class="industryBar"> <view wx:for="{{industryTypeList}}" wx:key="index" class="industryBarItem"> <view class="barItemName {{activeIndex==index?'active':''}}" bindtap="clickTa
2021-01-13 14:45:20
756
原创 移动端使用html2canvas将页面元素生成图片遇到的那些坑
需求:接口返回数据渲染到页面之后,将该区域的内容生成图片并保存到本地第一次尝试(fail):思路:使用2.x.x版本的html2canvas插件生成图片之后,动态创建a标签并添加自动触发的点击事件进行图片下载。坑:Android偶尔会出现下载不了生成的图片,ios不会生成图片第二次尝试(fail):思路:使用1.x.x版本的html2canvas插件生成图片后,将图片放入蒙版中指引用户长按图片保存到本地。坑:iPhone X,iPhone 11只会生成一次图片。第三次尝试(success):
2021-01-11 17:49:04
1140
原创 移动端边框1px问题
解决方法:使用伪元素#footerNavPage .navBar::before { content: ""; width: 100%; border-top: 1px solid #f5f5f5; position: absolute; top: 0; left: 0; -webkit-transform: scale(1, 0.5); transform: scale(1, 0.5);}
2021-01-11 17:11:07
81
原创 input在ios中光标过长问题
操作当前input,设置上下padding.van-field__control { line-height: 0.46rem; padding: 0.25rem 0;}
2021-01-11 17:08:03
176
原创 css3实现loading动画
效果:·code<!DOCTYPE html><html><head></head><style type="text/css"> .loading { width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 1000; background-color: rgba(255, 255, 255, 0.5); di
2020-10-28 09:19:18
224
原创 Jquery实现城市选择(省市联动)
***·需求:***鼠标移入切换城市,显示城市选择框;鼠标移出选择框,选择框消失;选择点击热门城市直接修改当前位置,点击省份后自动切换到对应的市选择框。·html<div class="position"> <div class="positionIcon"> <span class="iconfont icon-dingweiweizhi2" style="font-size: 14
2020-10-20 14:35:06
2696
3
原创 Jquery实现头部导航
***·需求:***鼠标移入一级类目,下拉框展示对应的二级类目和三级类目,鼠标移出下拉框或者一级类目列表隐藏下拉框(兼容ie、火狐、safria、QQ浏览器、谷歌浏览器)·html <div class="tabBox"> <!-- 一级类目列表容器 --> <ul class="tabUl"></ul> <!-- 导航栏下
2020-10-19 17:14:12
685
原创 Vue中多级(三级)组件传值
**·需求:**A组件引入了B组件,B组件引入了C组件,A组件需要传给C组件一个变量(showDisBtn),C组件需要调用A组件中的方法(showDisModal)并传参。·组件A·B组件(BizTable)·C组件(table)
2020-09-01 16:35:53
3153
原创 使用qrcodejs2插件生成支付二维码
·需求:后端给二维码内容链接,前端把链接转为二维码,二维码超时可点击按钮刷新二维码·html<template> <div class="wechat"> <div ref="qrCode" v-loading="loading" class="qrCode"></div> <p>请使用微信扫描二维码支付,请在5分钟内完成支付,过期请刷新支付码</p> <el-button @click="ref
2020-08-03 15:19:15
932
原创 VUE动态绑定静态资源中的图片不显示
VUE动态绑定静态资源中的图片不显示·需求:根据不同的路由渲染不同的导航栏(以下为更改前后部分代码),需要使用require引入静态资源中的图片·prev<template> <div class="rootItem" v-for="(item,index) in sideBarList" :key="index"> <h3 @click="$router.push(item.path)"> <span>
2020-07-25 10:45:45
775
原创 url的组成部分以及获取各部分的信息
url的组成部分以及获取各部分的信息eg:“https://www.baidu.com:8080/news/index.html?kw=Romeo&lover=Juliet#q_418871472”组成部分:1.协议部分:该url的协议部分为“https”,这代表网页使用的是HTTP协议。在Internet中可以使用多种协议,如HTTP,FTP等。例中使用的是HTTP协议。在“htt...
2019-12-18 15:03:02
586
原创 原生JS实现登陆注册的验证
原生JS实现登陆注册的验证// An highlighted blockvar foo = 'bar';<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> form...
2019-10-11 20:12:10
1185
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人