- 博客(25)
- 收藏
- 关注
RSS订阅
原创 react后台管理系统表单页面编辑切换的时候提示，很强
后台管理系统很常见的就是这种编辑页面，我是用antd的。因为用户没填完没点保存实际上填的数据并没有保存起来，当时想着切换的时候先存起来，点回去的时候再复原，但是考虑到可行性，不太现实，直接提示你离开就没了，要离开请随意。 然后开始着手逻辑，领导的意思是表单里面填了东西的切换页面就要提示，当然除开保存按钮，那我赶紧去查了form的属性，直接贴代码：写个函数传两个参数进去// ...
2020-03-18 19:18:35
1522
原创 react中使用antd的upload组件，一个大坑比
先来看下大概实现的样子，1、用本地的统一的缩列图2、显示文件名字和大小3、上传正常，编辑回显正常我看了下官网，确实是可以实现，大小和名字可以传个节点给到name这个属性，缩列图可以require个本地图片进去，然后上传好把他放在redux上绑定，但是会遇到好几个问题1、每次上传好的数据发给后台东西一个fileList里面太多，只能把关键的字段塞进去2、文件服务器失败的...
2019-11-19 11:03:07
6508
3
原创 你所不知css世界的vertical-align
很多人不知道其实vertical-align的属性值支持数值，这在实际开发的时候实用性非常强，主要是它不仅兼容性好而且可以精确控制内联元素的垂直对齐位置，通常vertical-align我们都是设置middle,top等，但是这个有个严重的不足之处，就是垂直对齐的位置是固定的，往往最后并不是我们想要的像素级精确对齐效果。当我们设置vertical-align：middle只能说是近似垂直居中,平时...
2018-06-21 13:24:37
412
原创 react中使用antd的treeSelect无法更改属性名，我发火了
项目里面要使用一个树选择器，但是动态返回的数据显示不出来，原因是结构属性不太一样，
2021-06-02 19:01:44
1529
原创 CSS实现气泡框，太强了胸弟！！
有个需求，弄一个简单的气泡框，网上大把教程，看下实现后是长什么样子直接贴代码了，没什么好说的，css .content { position: relative; } .my-popover-father { position: absolute; right: 0; z-index: 99; } .collect-title { display: inline-block
2020-09-02 16:06:27
321
原创 antd mobile的抽屉效果的实现，坑多
最近用react和antd mobile写一个h5,有个主菜单的，边上有三条横杆，点击弹出主菜单，效果大概是这样。这个是我实现后的效果，边上的三条杠也是自己写的，css写的，网上很多，这个不多说了，直接说抽屉功能，官网地址就一个demo，点这个地址，先引进来，import { Drawer } from 'antd-mobile'; // html<Drawe...
2020-03-25 20:53:54
2846
原创 react里面如何判断鼠标滚动方向！！！
产品他们有个需求就是，在页面上往下滚动的时候隐藏头部的导航栏，鼠标向上就显示该导航栏，这里有两个点要注意，第一是滚动的是哪个容器，react怎么监听滚动事件，其实也不难，需要慢慢调试。上代码：componentDidMount() { var isFirefox = navigator.userAgent.indexOf('Firefox') !== -1 //Firefox...
2019-09-13 09:11:04
1918
原创 如何把antd的日期插件里面的月份日期改成中文？？？
我在官网例子，用的就是DatePicker日期选择框，明明看到的里面月份都是中文，放到后台管理系统的时候也不知道为啥月份变成英文了，直接上解决方法：开头先引入// 以下4行引入解决日期控件英文的问题import moment from 'moment'import locale from 'antd/lib/date-picker/locale/zh_CN'import 'moment...
2019-09-13 08:42:04
7361
5
原创 react的antd的upload组件上传限制图片尺寸和视频宽高，大坑比
最近用antd写后台管理系统，首次接触antd，刚开始蛮顺利的，到后面坑越来越多，基本解决了，后续我会继续和大家分享我遇到的坑，现在先来搞一搞这个Upload组件，这个 组件上传的一些限制在beforeUpload这个方法里面调用，然后我直接写两个方法://checkImageWH 返回一个promise 检测通过返回resolve 失败返回reject阻止图片上传export fu...
2019-08-25 09:24:15
10094
6
原创 preload.js最近刚好用上，稳得一（预加载图片、音频、视频）
之前做项目里面的资源太多，老是有图片没加载出来被人投诉，之前也写过图片预加载感觉还是很不稳，况且只能加载图片，我最近的项目有视频、音频和图片，然后我导师推荐我用preload.js，直接来代码呐，老弟 <script src="./lib/preloadjs.min.js"></script>先把库搞下来，http://www.createjs.cc/p...
2019-02-23 09:31:11
12308
1
原创 你所不知道css世界的border属性
border就是边框，但是衍生出来的特性可以解决很多棘手的问题，在图形构建、体验优化以及网页布局作用巨大，同时能保证良好的兼容性和稳定性。1.border-width属性thin：薄薄的，等同于1pxmedium(默认值)：薄厚均匀，等同于3pxthick:厚厚的，等同于4px2.利用color计算值作为边框颜色这个可以取代border-color,用来做一些很有用的实践，比如我们在上传图片的时候...
2018-06-22 11:05:54
424
原创 你所不知css世界的BFC
BFC全称为block formatting context,中文为“块级格式化上下文”，请大家记住这个表现原则：如果一个元素具有BFC，内部子元素再怎么翻江倒海，都不会影响外部的元素。所以，BFC元素是不可能发生margin重叠的，因为margin重叠会影响外面的元素的；BFC也可以用来清除浮动的影响。那怎么会触发到BFC呢，1.<html>根元素2.float的值不为none3.o...
2018-06-21 10:30:27
210
原创 你所不知道css世界的absolute
最近在恶补css的东西，也是和大家分享下position:absolute的巨大用处，先说下大家都很熟的，设置这个属性后，其display计算值就变成block，然后会破坏正常的流特性。现在说一下两个实用性很强的知识点。1.具有相对i特性的无依赖absolute绝对定位一个绝对定位元素，没有设置任何的left/right/top/bottom,而且其祖先元素全部都是非定位元素，其位置会在哪里呢，大...
2018-06-21 08:30:00
261
原创 axios 将post请求时把对象obj数据转为formdata
今天在对后台接口的时候，上传报名信息，利用axios 的post请求，发数据，但是显示参数错误，但是查看header的时候，发现居然是一个对象：这可不行，然会就想着怎么把对象搞成formdata,直接加入两段代码就好， transformRequest: [function (data) { let ret = '' for (let...
2018-05-30 19:11:11
21512
6
原创 vux还是很棒棒哒，说下toast,x-address,datetime
在vue项目里面，要快速上交项目，怎么快怎么来，于是呼就用了vux,但是用了淘宝那个适配后，它那些组件里面的样式字体变得很小，那可怎么办，只能改咯，要在全局改才有效，一定要注意样式作用域和优先级。但是设计搞和vux里面的样式差别还是有点大，这个我可以接受就是需求还有点不一样，1.x-address我只想选湖北省的市和县,它是引入这个json数据的，那没办法，那我只能自己搞一个hubeiAddres...
2018-05-29 17:26:24
2144
3
原创 vue pull-to下拉滚动加载请求分页（无敌那）
因为移动端滚动加载分页是必须做的，网上也有很多插件，我用的是pull-to,这个很简单，先安装一波，npm install vue-pull-to --save//然后引进来,放在组件上面注册好import PullTo from 'vue-pull-to'官网文档在这里：https://github.com/stackjie/vue-pull-to/blob/master/README.zh-C...
2018-05-29 16:44:42
17726
10
原创 如何拿到x-address里面的字符串而不是id
最近的vue项目是产品线上的,比较赶，有个地址输入选择的，我直接使用了vux的x-address，安装vux我就不多说了，网上很多教程，x-address挺好用的，直接引进来就可以，但是吐槽一下在移动端适配的时候样式修改很难哎，进入正题，我们在官网上也可以看到，点击选择完地址之后，返回的值默认是绑定id的，就是比如说，在v-model绑定的值就是一串id,但是我们要求发给后台的是北京市 市辖区 东...
2018-05-25 13:33:51
2464
2
原创 ie8的兼容性问题background-size解决方案（sass编写）
background-size是css3里面的属性，ie8不识别，我在项目里有遇到设置背景铺满的，就是background-size：cover;网上的方法很多，实用过后觉得这个方法不错，直接在样式后面加上，filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=Enabled, sizingMethod=scale ,...
2018-05-01 22:21:43
897
原创 设置背景透明时里面内容内容模糊（已解决）
我们通常会遇到这种问题，特别是对于我这种前端小白，在导航栏鼠标放上去的时候，设置背景透明，结果里面的文字也变暗了，这是因为子元素的文字继承了父元素的属性了，那怎么办，用伪类设同级元素就好。先贴代码，我的html<div class="head"> <div class="width-keep"> <div class="logo"><
2018-05-01 22:07:04
2765
原创 用swiper4插件做background背景全屏轮播
swiper插件非常好用，其实swiper官网上面的资料非常齐全，只是刚好项目用到，就来写一写，加深理解。首先引入js和css,<link rel="stylesheet" href="libs/swiper/swiper-4.2.2.min.css"> <script src="libs/swiper/swiper-4.2.2.min.js"></script&g..
2018-04-20 22:22:44
4283
原创 html2canvas完整demo解决图片跨域问题(已经成功啦啦)
实现html内容转成图片格式搞这个东西之前尝试过好多种方法，包括canvas画图，php gd2画图，画的我怀疑人生，我就想实现一个大概名片的效果，不用太炫酷，最后还是选择用html2canvas,但是遇到的问题还是图片的跨域问题，因为跨域问题，需要代理服务器设置header，我迟点说，我的demo是在本地服务器上测的，就是127.0.0.1这个。 赶紧贴一波代码： css: *{
2017-08-10 17:34:12
77212
24
原创 swiper.js在angular里使用的一些问题
因为项目的框架用的是angular,而轮播用的是swiper.js,这个插件做轮播很高效和实用，不过可能angular也不是很熟，照着官方文档把swiper.js引入的时候，发现第一张图片永远是一闪而过，这就很尴尬，问题可能是我的轮播图片是通过ng-repeat从后台拿出来的数据。 swiper的机制是：初始化的时候自动扫描swiper-wrapper类下有多少个swiper-slide类块，则允
2017-07-31 07:51:51
2996
原创 angular里面使用带标签的文本
angular里面使用带标签的文本angular中的html为了保护外部插入内容改变文本，自带过滤器，把标签内容自带转义，所以你在数据库拿出来的带标签文本会被转义成特殊字符。其实很简单，直接上代码。 在js里面：//定义一个通用过滤器对文本标签的内容过滤 app.filter(‘trustHtml’, function (sce) { return function (input) {
2017-07-31 07:30:35
1922
原创 thinkphp3.2处理多张图片上传（已成功）
在做后台图片编辑和上传的时候往往会遇到比较棘手的问题，就是如何上传多张图片，本来以为要在input后面加个按钮，判断要添加的时候，在创一个input，这样子的话每个图片都有自己一个对应的name,这样后台便会拿到图片的路径。 不用以上方法，其实也很简单： 1.我们在表单form那里用数组去保存图片的name,再加上一个multiple,这样按住ctrl就可以多选了。<input class="f
2017-07-11 22:24:14
14100
4
原创 thinkphp3.2嵌入百度编辑器ueditor
因为排版要求，很多时候我们需要嵌入富文本编辑器，输出带html标签的文本内容。因为我最近做一个后台管理系统，要求编辑好文本内容，让它输出带html标签的文本存到服务器，客户端发请求拿到服务器的带标签文本。我用的是ueditor, 1.首先我们去到这里http://ueditor.baidu.com/website/download.html 下载php版本utf版本。 把它放到Public的目录
2017-07-11 21:40:44
461
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人