- 博客(55)
- 收藏
- 关注
RSS订阅转载 手机端网页：可拖拽悬浮按钮
<style type="text/css"> #touch { width: 60px; height: 60px; position: absolute; right: 25px; bottom: 20px; margin-left: -30px; margin-bottom: -30px; z-index: 99999; }</styl.
2020-12-28 14:17:25
663
转载 小程序web-view打开PDF格式文件的安卓苹果兼容性问题
小程序中打开pdf格式原本可以使用web-view（承载网页的容器。会自动铺满整个小程序页面，个人类型的小程序暂不支持使用）<web-view src="{{link}}"></web-view>src里放链接就能够正常实现但是src里面放pdf的链接涉及到了兼容性问题（苹果手机可以正常打开pdf格式文件，安卓打开为空白）所以如果src里面放pdf格式就会出现问题，这个时候就要使用到微信的另一个API，openDocument（新开页面打开文档）这个时候就可以在安卓
2020-12-18 15:07:22
2937
转载 echart x轴文字过长换行全部显示
使用echart图表开发过程中，经常遇到类目轴（一般x轴）数据名称过长导致图例展示效果很差，写了一个方法当x轴名称较长时换行显示。效果如下图所示：<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /&..
2020-12-09 14:05:45
2596
转载 uni-app app端文件多张上传
uploadImg() { uni.chooseImage({ success: (chooseImageRes) => { for (let i = 0; i <chooseImageRes.tempFiles.length; i++) { let obj = new Object(); obj.name = chooseImageRes.tempFiles[i].name; obj.uri = chooseImageRes.tempFiles[i].pa.
2020-12-08 14:15:07
3125
转载 HBuilderX 连接网易mumu手机模拟器进行App开发
常见的安卓手机模拟器：手机模拟器名称 对应端口号 夜神模拟器 62001 天天模拟器 6555 海马玩模拟器 26944 逍遥模拟器 21503 网易mumu模拟器 7555 我使用的是网易mumu ，下载地址：http://mumu.163.com/下载后直接安装即可。...
2020-12-07 15:10:10
1679
转载 小程序开发之解决第一次加载页面获取不到openid的问题
小程序开发过程中，index.wxml加载时需要使用用户信息，之前wx.login是写在app.js的onLaunch函数中，通过后台获取到openid后存储到本地缓存中，之后在index.js中获取openid老是出现第一次取值为空，第二次再打开就有值的情况。app.js:onLaunch: function () { var that = this wx.login({ success: function (res) { //code 获取用户信息
2020-11-19 16:51:16
2162
转载 JS获取当前日期前7天
function getStandardDate(){ var _date=new Date(); var year=_date.getFullYear(); var month=_date.getMonth()+1; var day=_date.getDate(); if (month<10) { month='0'+month; }; if (day<10) { day='0'+day; };.
2020-11-18 14:30:53
2246
转载 vue js手机端滑到某一个位置时固定位置显示
1、HTML <div id="searchBar"> <ul class="items_filter" :class="searchBarFixed == true ? 'isFixed' :''"> <li><span class="all">综合</span></li> <li><span class="all">综合2</span></li>
2020-11-12 13:04:20
545
转载 在开发Vue项目时，页面加载时出现闪烁问题
<style type="text/css"> /* 1、通过属性选择器 选择到 带有属性 v-cloak的标签 让他隐藏 */ [v-cloak]{ /* 元素隐藏 */ display: none; }</style><body> <div id="app"> <!-- 2、 让带有插值 语法的添加 v-cloak 属性 在数据渲染完场之后，v-cloak 属性会被自动去除，.
2020-11-12 12:53:58
473
转载 Vue登录拦截 登录后继续跳转指定页面
在开发中我们经常遇到这样的需求，需要用户登录后才可以访问该页面，如果用户没有登录点击该页面时则自动跳转到登录页面，登录后又跳转到链接的页面而不是首页，这种问题该如何去做呢？1、在路由器router下的 index.js 的配置中，给需要拦截登录的页面的路由上加一个meta: {loginRequest: true} ,其中loginRequest 变量自己可以随意定义2、在main.js文件里面添加beforeEach钩子函数解释： router.beforeEach((to, from, n
2020-11-06 17:33:13
2322
转载 禁止双击选中文本
禁止双击选中文本onselectstart 方法// ie和chrome都支持的onselectstart 事件, 但是firefox不支持,所以firefox使用css来控制 <body onselectstart = "return false" style = { -moz-user-select : none }></body>另一种思路 => 清空选中 window.getSelection ? window.getSelection().r
2020-10-15 14:12:54
344
转载 基于vue的文件夹上传插件
基于vue-simple-uploader封装文件分片上传、秒传及断点续传的全局上传插件1. 前言之前公司要在管理系统中做一个全局上传插件，即切换各个页面的时候，上传界面还在并且上传不会受到影响，这在vue这种spa框架面前并不是什么难题。然而后端大佬说我们要实现分片上传、秒传以及断点续传的功能，听起来头都大了。很久之前我写了一篇webuploader的文章，结果使用起来发现问题很多，且官方团队不再维护这个插件了， 经过多天调研及踩雷，最终决定基于vue-simple-uploader插件.
2020-09-28 14:53:58
3865
2
转载 VUE设置浏览器icon图标
在创建Vue项目时一般会用默认的项目标题和图标，如下图所示:不是很美观也可能不符合项目的需求，所以有时候就需要改变项目在浏览器上方的标签名称或者图标。找到项目根目录的index.html，如图：进去就能够修改title，也就是在浏览器上方的标题<meta name="viewport" content="width=device-width,initial-scale=1.0"><title>template</title>如果需要在标题旁边加
2020-09-22 09:17:32
2667
转载 Vue工程打包部署到服务器后，静态文件（图片）不显示
问题描述：在自己工程里打开Powershell窗口，运行npm run dev在本地浏览器打开http://localhost:8080/index.html------工程运行良好！但是npm run build时获取打包文件dist并部署到服务器上后发现打开http://10.0.0.19/dist/index.html后某些静态图片显示不出来…也可以想象出，此类问题肯定是打包文件获取问题------针对于如此，可做以下处理：1.在config（文件夹）—>index.js中，添加（如图的红色
2020-09-16 08:50:47
8581
转载 vue项目storage本地存储
1.在model文件夹下面新建一个storage.jsconst storage = { set(key,value){ sessionStorage.setItem(key,JSON.stringify(value)); }, get(key){ return JSON.parse(sessionStorage.getItem(key)); }, getForIndex(index){ return sessionStorage.key(index).
2020-07-30 16:20:14
8728
原创 vue实现动态路由--后台返回路由表（并解决页面刷新，路由找不到的问题）
先大致说一下自己的思路。其实后台返回的权限表跟我们前端自己配置的路由格式是差不多的（格式可以跟后台沟通）。我们需要做的是根据后台返回的路由，然后进行遍历，生成一个本地的路由表。然后利用Router.addRouters()这个方法，把我们新生成的路由表添加到路由中。1.首先我们要在router.js里面写一个静态路由（就是说不需要任何权限就能看到的页面）import Vue from "vue";import Router from "vue-router";import store fr
2020-07-30 14:47:43
7535
1
原创 axios设置请求拦截后，数据请求成功，走error的问题
这个时候看一下response拦截器这里的代码 中间有这样一句service.interceptors.response.use( response=>{ //在status正确的情况下，code不正确则返回相应的错误信息 return response.data.code === 200 ? response:Promise.reject(response.data.message); }）注意一下这里return的值。我自己调试的时候出现标题描述的这个问题，是..
2020-07-20 13:09:32
5585
1
原创 关于antd table组件中，数据渲染条数跟后台传入数据不一致的问题
如果出现表格数据渲染 跟后台传过来的数据的条数不一致的情况，绝大概率的rowkey的问题。我这边当时调试的时候，后台的数据我是存在store中的，包括在table重新渲染的时候，我这边传过来的数据条数都是跟后台的保持一致的，但是渲染的时候 一共六条数据，就只渲染出来一条。于是就看了一下传过来的数据，发现这六条数据的key居然是一模一样的，这也就是为什么明明过来了六条数据，结果表格只渲染了一条。在网上搜了一下，发现因为rowkey一样，导致渲染的时候数据多于后台传过来的数据，这种情况我还没遇到过。..
2020-07-14 15:20:09
2034
3
转载 如何搭建一个react项目（包含路由、权限）
init项目1.创建项目文件夹并进入mkdir react-projectcd react-project2.初始化npm输入npm init ，按照提示填写项目基本信息：webpack1.安装webpack（webpack4.X）npminstall--save-dev webpack webpack-cli -g（--save-dev与--save的区别：--save-dev表示只是在编译过程中所依赖的包，例如：webpack、sass-loader等 最后在
2020-07-08 13:28:07
1124
转载 axios自定义封装
import axios from 'axios';import { Loading } from 'element-ui';import Cookies from 'js-cokie';//基于axios基本配置创建实例const serviece=axios.ceeate({ baseUrl: '', timeOut: 10000, headers: { source: 'YTO-STEWARD' }});let loadingInsta.
2020-07-03 11:07:33
205
原创 ant design Table本地排序（汉字，数字，字符串）
根据官方文档介绍 ，排序是在Column上面添加的。这里就写个简单的例子（只有表头部分，一看就会）const columns = [ { title: '汉字', dataIndex: 'name', sorter:(a,b)=>a.name.localeCompare(b.name) }, {
2020-06-30 18:49:47
5734
1
转载 layui表格动态列使用templet
var arr = [];var fields = ['col1', 'col2', 'col3', 'col4', ];var titles = ['ID', '标题', '内容', '作者'];for(var i=0;i<fields.length;i++){ arr.push({field:fields[i], title:titles[i], sort: true, templet:function(d){ return d[this.field]; //.
2020-06-22 15:44:16
2875
1
原创 前端实现元素拖拽放大缩小re-resizable
官网参考链接https://www.javascriptcn.com/read-70781.html
2020-05-15 15:16:42
2720
原创 前端实现元素拖拽的组件react-draggable
参考官网https://www.npmjs.com/package/react-draggable
2020-05-15 15:14:28
7079
1
翻译 前端 截取某个区域，导出图片html2canvas
前提：整个放canvas转成图片的区域<div id="mainView"></div>代码const targetDom = document.querySelector("#mainView") const copyDom = targetDom.cloneNode(true) copyDom.style.width = targetDom.scrollWidth + 'px' copyDom.sty..
2020-05-15 14:37:15
955
翻译 Vue之Axios跨域配置
1.修改main.js,加入如下代码import Axios from 'axios';Vue.prototype.$axios = Axios;Axios.defaults.baseURL = '/api';2.配置代理config文件夹下的index.js 文件中的proxyTable字段修改 dev: { env: require('./dev.env'), port: 8090, autoOpenBrowser: true, assetsS
2020-05-12 13:46:00
282
转载 vue根据路由访问实现动态标签页
效果接下来讲一下思路，其实就是要监听路由，当访问路由时讲路由的数据push到数组中上代码// tagsView.vue<template> <div class="tags" v-if="showTags"> <ul> <li class="tags-li" v-for="(item,ind...
2020-05-08 15:45:12
1875
转载 React build项目部署后IE浏览器报错：对象不支持"assign"属性或方法的解决（解决ie不兼容的问题）
用React build项目，部署后 IE 浏览器打不开（我用的是 IE11），控制台报错：SCRIPT438：对象不支持"assign"属性或方法。这是 IE 浏览器 对 ES6 的兼容性问题。解决方法：使用 create-react-app 官方提供的react-app-polyfill，然后在入口文件 index.js 中引入：react-app-polyfill软件...
2020-04-24 15:34:22
2280
原创 关于react有些页面无法使用this.props.history.push进行路由跳转的问题
页面使用装饰器 connect 会导致路由缺失（一般只要是Link这种跳转，并且Route在当前页面，就不会出现路由缺失。我出现的情况是当前页面只有Link，控制台打印this的时候 很明显没有history这个方法）解决办法：使用withRouter包裹connect,实现跳转的问题；export default withRouter(connect()(App))...
2020-04-23 13:15:06
2906
转载 vue学习-vue router路由配置，元信息meta的使用-登录拦截验证
路由基本配置1.在router文件夹中找到 indexs.js注意：如果创建项目是没有安装router，不会有router文件夹，该文件夹在src 文件夹的根目录中// 1.引入路由以及vue，下面的是固定写法，照写就可以import Vue from 'vue'import Router from 'vue-router'Vue.use(Router) 2.创建路由实例...
2020-04-22 13:22:42
1262
转载 js实现一个区域内滚动效果
<html> <head></head> <body> <form id="form1"> <DIV id=demo style="OVERFLOW: hidden; WIDTH: 230px; HEIGHT: 150px"> <DIV id=demo1> <table...
2020-04-22 13:16:27
1023
原创 后台返回字节流，前端在页面显示（如pdf/svg/img）
这里我用的是axios 所以就只说一下axios吧Axios({ methods: 'GET', url: ‘url’, responseType: 'blob'//这里意思是接收返回文件格式 }).then(res => { let blob = new Blob([re...
2020-04-21 17:57:56
6437
1
转载 Axios请求关于点击按钮下载文件
axios.get(url,{params:params,responseType: 'blob'}).then(res = >{let blob = new Blob([res], {type: "application/vnd.ms-excel"});let objectUrl = URL.creat...
2019-11-06 15:11:33
749
原创 关于redux-thunk中间件的使用
安装 ： npm install redux-thunk --savereducers中的所有操作都是同步的并且是纯粹的，reducer都是纯函数，纯函数是指一个函数的返回结果只依赖于它的参数，并且在执行的过程中不会对外部产生副作用在实际开发应用中，我们希望做一些异步（如Ajax请求）且不纯粹的操作（如改变外部的状态）这时候就要用到中间件的方式来实现在index中中...
2019-11-06 15:08:27
236
原创 解决react页面刷新，store中保存的状态消失问题
redux的store状态数据不是永久保存的，state只是一个内存机制。我们知道的本地数据库或者像localstorage之类的缓存系统才有可能长时间的保存数据，redux-persist可以让你的数据从state分离出来，保存到浏览器缓存中，以便实现数据的持久化存储下面是我自己的代码，没有使用thunk中间件我圈出的红色部分就是是用persist需要用到元素，其他关于actio...
2019-11-06 15:02:09
5266
原创 解决antd表格行操作获取不到数据的问题
<Table columns={columns1} dataSource={this.state.dclData} onRow = {(record) => { return { onClick: () => { console.log(record);//这里是点击行的数据，可以把需要的数据存入...
2019-11-06 14:54:40
5225
原创 关于react-router中点击路由跳转，找不到路由组件的问题
使用嵌套路由在父级不能用exact， 因为当你匹配路由时路径加了子路由，导致父级路由路径不匹配从而父子组件都显示不了。例如你这个/user/details 使用了exact，当路径变为/user/details/msg是匹配不到/user/details的，这样的话就无法渲染Details而msg又是在Detail里面所以也不会渲染...
2019-11-06 14:51:57
2448
原创 react-redux的安装以及chrome工具的使用
安装redux：npm install --save redux安装react-redux：npminstall --save react-redux安装chrome调试工具： npm install redux-devtools-extension --save-dev（chrome扩展插件要自己手动安装）不知道什么原因 安装react-redux一直失败，然后在packa...
2019-11-06 14:48:33
1434
原创 ant design Table可编辑的单元格改进版
antd官方也有给文档，但是超级麻烦，代码量还超级多，改编了一下如图：这里table的columns的写法，如下：const columns2 = [{title: '尺寸名称',dataIndex: 'name',filterDropdown: true,filterIcon: <Icon type="edit"/>,render: () => &l...
2019-05-31 18:18:24
16324
30
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人