- 博客(29)
- 资源 (5)
- 收藏
- 关注
RSS订阅原创 前端武器库之常用的方法封装
1.判断两个数组是否相等/** * * @desc 判断两个数组是否相等 * @param {Array} arr1 * @param {Array} arr2 * @return {Boolean} */function arrayEqual(arr1, arr2) { if (arr1 === arr2) return true; if (arr1.length != arr2.length) return false; for (var i = 0; i
2022-01-20 17:44:11
246
原创 element-ui 日期组件 限制可选日期
通过这个属性 来控制有几种方法1.data里面直接定义 pickerOptions1 这个对象data(){ return { pickerOptions1: { disabledDate: (time) => { return time.getTime() < new Date(this.value1).getTime();可选的时间 小于 this.value1 ..
2021-10-29 17:09:06
1211
1
原创 表单 自定义校验 函数
对于复杂表单类型，如表单对象嵌套一个对象1.创建 rules.js 文件let common = { checkRules(params, rules) { //表单校验 for (let key in rules) { let arr = rules[key] for (let i = 0; i < arr.length; i++) { let rule = arr[i], val = params[key] === 0 ? '0' : params[key]
2021-10-27 18:28:21
399
原创 前端实现 无限点击 前一周 后一周 前几个月 后几个月
项目需要实现 点击时间 切换echarts 数据 记录一下1.实现 前一周 本周 后一周 // 处理日期 getDates(date) { var year = date.getFullYear() + '-' var month = ((date.getMonth() + 1) + '-').length === 2 ? ('0' + (date.getMonth() + 1) + '-') : (date .getMonth() + 1) + '-' va
2021-09-02 15:40:35
213
原创 前端面试的高频问题。你学废了么。
（1）、react的优势（2）、diff算法的理解（3）、为什么要单向数据流、组件交互。（4）、prop和state的区别（5）、前端工程化的理解、如何自己实现一个文件打包，比如一个JS文件里同时又ES5 和ES6写的代码，如何编译兼容他们？（6）、如何实现垂直和水平居中，多种方法。（7）、流式布局如何实现，响应式布局如何实现？（8）、对移动端开发了解多少？（9）、跨域的方法：自己实现JSONP，如何设计？为什么要跨域？为什么JS会对跨域做出限制？（10）、原型、原型链、继承如何实现？（
2021-07-01 15:39:18
98
原创 vue+elementUI 上传图片时压缩图片
项目中由于后台接口的原因，写了两种上传方式1.自动上传2.手动上传针对这两种方式，记录下，如何压缩上传图片自动上传时压缩图片模板代码： <el-upload class="upload-demo marginBom" :action="fileUrl + 'file'" :data="{
2021-04-22 14:36:01
3141
1
原创 vue 项目中使用 评论功能 带emoji表情包
先看下效果：由于项目中需要做一个 评论的功能，思索一番 准备自己写，但打开度娘 一下就看到这个添加链接描述挺好的，还带表情 刚好满足需求1.安装 2.引入插件3.使用 就不在介绍 上面的链接有记录下我在项目中是怎么使用的以及改了哪些东西这是实际开发项目效果如最上面的效果图这里需要主要几点，关于使用和修改1.你可以 按照上面的步骤 npm安装，2.也可以自己在项目中封装这样一个评论组件,这样你也好改一点如果你是npm 安装的 那么你需要改样式啊，参数啊什么的 ，那简单啊 ，我直接在no
2021-01-21 17:35:08
4016
5
原创 vue+tinymce 实现上传图片和自定义插件
选择富文本插件的时候 还是选择了这个 所见即所得的富文本编辑器 tinymce1.安装tinymcenpm install tinymce -Snpm install @tinymce/tinymce-vue -S如果安装失败，或者报一个 Obj…啥的错误 也许是icon文件没引入，也许是版本不对。在package.json中加上一下的代码 然后npm install "@tinymce/tinymce-vue": "^2.0.0", "tinymce": "^5.0.3",至于
2021-01-12 10:51:29
4773
转载 vue+ElementUi 选择框选中之后翻页进行状态保持。及默认选中
表格代码：<el-table:data="list"ref="multipleTable":row-key="(row)=>{ return row.classId}"@selection-change="handleSelectionChange"style="width: 100%"><el-table-column type="selection" :reserve-selection="true" ></el-table-column><
2020-11-26 16:26:56
1640
原创 object.assign的使用
项目中经常会将一个对象赋值给另一个对象，我们可以直接使用 = 号 也可以使用es6新增的object.assign这个方法，不同点就是 浅拷贝与深拷贝 引用类型指针的问题今天就遇到一个问题。。。。项目中 父组件 详情页有增加和修改两个按钮 增加和修改公用一个组件 于是在父组件详情页 会调用这个公用的子组件，并将详情的值传过去 以便修改 于是我是这样写的 watch: { orderFormData: { immediate: true, handler(newVal
2020-11-25 09:59:07
471
原创 vue 刷新子组件 出现闪屏的问题
项目中 在做表单的开发时 新增或修改需要对表格进行初始化 ，也就是置空表单 有很多方法 ，我是在子组件上加上key 每次打开子组件 key的值都会不一样 这就出现一个问题 每次打开子组件 数据置空是没问题了 总是会闪一下。就好请求数据 还没请求成功页面出现 html代码 一开始使用v-clock 没用!..后来查阅了一番 我一开始将key的赋值放在了 点击事件 也就是点击按钮弹出子组件这个方法中。。需要放在子组件发射的方法中 也就是关闭子组件时，我是在弹出子组件时。 下面调整后的子组件：<tem
2020-11-23 10:23:12
1861
原创 vue axios 请求拦截与响应拦截
请求拦截：在我们发送请求给服务器前我们可以做的一些事响应拦截: 请求完成服务器返回我们数据及请求状态，在这里可以对响应统一做处理在使用vue 开发后台管理系统时 自己也是调了半天。1.首先我们引入我们需要的资源import axios from 'axios'import router from '@/router'import { MessageBox, Message,Loading } from 'element-ui'import Qs from 'qs'import store
2020-11-23 10:02:21
844
原创 element-ui 使用table current-change这个方法时 选择表格报错
先看下报错子组件 获取父组件的数据 来渲染表格 表格数据是动态的 在子组件用watch 深度监听 来实时渲染排查了半天 找不到报错原因 看了 代码逻辑 没有问题，然后检查current-change这个方法 查资料看到这个 于是 在表格加了一个属性报错问题 解决 …真实不可预测的后果...
2020-10-30 11:11:53
3949
1
原创 去除element-ui中table 的hover效果
.el-table--enable-row-hover .el-table__body tr:hover > td { background-color: rgba(0, 0, 0, 0) !important; }写一个rgb 色值 替换即可
2020-10-23 11:39:51
11418
2
原创 element-ui 获取 select 的label值
<el-select v-model="form.personId" placeholder="请选择负责人 可搜索" @change="getUserName" filterable > <el-option v-for="(item, index) in userList" :key="'i.
2020-10-23 11:37:31
960
原创 vue element-ui 封装drawer 抽屉组件
子组件<template> <div class="com"> <el-drawer title="我是标题" :visible.sync="drawer_" :direction="direction"> <span>我来啦! {{task.name}}</span> </el-drawer> </div></template>&l
2020-10-23 11:31:20
5160
原创 axios 修改Content-Type设置
//如果想传过去的参数是字符串就是这用形式import axios from 'axios'import qs from 'querystring' axios.post(url, qs.stringify(params), { headers: { 'Content-Type': 'application/json;charset=UTF-8' },}).then(res => res.data) //如果想传过去的参数是对象就是这用形式axios.post(url,
2020-09-26 10:10:14
7969
原创 vue-admin-element学习(四)之elementUi的表格使用
<el-table :data="tableData" style="width: 100%">//---:data="用于存放请求数据回来的数组" <el-table-column label="索引值" width="400"> <template slot-scope="scope">//--- 这里取到当前单元格 <span>{{ scope.$index }}</span>//--- s
2020-08-27 10:32:01
1481
原创 vue-admin-element 搭建后台管理系统学习（三）权限之动态渲染侧边栏
在后台管理系统中权限分配角色权限之类的是必不可少的，项目用的是vue-admin-element一个后台基础模板，关于权限路由在vue-element-admin集成模板中有详细的代码，这里是我在项目中开发学习整理的。以下内容是用户的粗粒度权限，关于细粒度（按钮级）权限的可以根据token来限制。主体逻辑：前端有两个路由表，一个constantRoutes（全部成员可访问）一个asyncRoutes（需要权限访问）用户登录有返回一个token，拿到token请求用户信息，用户信息中返回当前角色拥有的
2020-08-26 14:44:04
1887
1
原创 vue项目开发遇到的报错
1.unknown mutation type原因：在组件中改变vue store状态的时候，依照官方文档 通过this.store.commit(′xxxx′),出现了上面的错误，如果你的vuex是模块管理的话，调用应该是this.store.commit('xxxx'),出现了上面的错误，如果你的vuex是模块管理的话，调用应该是this.store.commit(′xxxx′),出现了上面的错误，如果你的vuex是模块管理的话，调用应该是this.store.commit(模块名/mutation
2020-08-19 15:55:17
335
原创 js 经典题型
<script> var i = 5; function fn(i) { return function (n) { console.log(n + (++i)); } } var f = fn(1); f(2); // 4 fn(3)(4); // 8 fn(5)(6); // 12 ...
2020-08-06 17:25:04
145
转载 什么是微信小程序基础库
由于公司需要开发小程序项目，就查看了小程序的官方文档 很多地方看到 有关基础库的东西在开发工具中的配置项中也看到了于是就在想 这个基础库 就是微信客户端的版本? 官方文档有一个 小程序的运行环境，基础库就是对这个环境的支持吗？那小程序是个啥呢 既不是原生App也不是传统浏览器的WEB应用，看起来像是在微信中虚拟出的一个APP。基础库是什么？基础库是小程序运行的必要环境，我们的开发主要就是面向基础库开发的。基础库封装了微信和手机的能力并提供给小程序使用，我们使用基础库提供的组件和API开发起来非常的
2020-08-05 16:08:35
3796
1
原创 使用node js 批量下载图片到本地
先贴代码var fs = require("fs");var path = require('path');var asyncF = require("async");var request = require('request');var imageLinks = [ "https://xxx.xxx.com/pn/wsec-img1/2020/6/4/0f5c6214-6c08-4efc-aa42-145947aba3d3.jpg", "https://xxx.xxx.com/pn
2020-08-05 09:36:05
2423
原创 使用新浪云搭建个人网站
本文介绍下 通过新浪云 如何搭建个任务网站，我们平时开发 想把自己的代码通过外部链接访问有很多办法，这里介绍的是一种免费方式，首先有以下几个步骤:1.注册新浪云账号2.创建云应用SAE3.上传代码4.通过配置的域名访问一、注册新浪云注册地址：，注册完成之后进入到 用户中心 用户中心你会看到如下界面点击SAE 立即创建，选择php标准运行环境、创建完成之后 你会看到点击 运行环境管理点击上传代码包你需要上传的文件打包后 上传就可以了 这里免费的空间额度有100MB，想想做个 vue
2020-07-28 09:42:01
520
原创 小程序中 微信授权登录 获取用户信息
由于微信改了getUserInfo 接口，所以现在无法实现一进入微信小程序就弹出授权窗口，只能通过 button 去触发第一步：在首页中校验 用户是否微信授权 如果没有 则去微信授权页 代码如下html 如下：<view class="container"> <view> <view wx:if="{{canIUse}}" > <view class='header'> <icon class="
2020-07-16 15:32:36
1045
原创 github 访问不了 解决方案
登录网站 https://ipchaxun.com/ ，输入github.com查询github最新的ip地址，并设置到host文件当中host文件的目录C:\Windows\System32\drivers\etc
2020-06-29 19:04:25
533
原创 前端面试中问到的问题，总结一下
@[TOC]目录面试中问到的问题 总结一下1.css相关的就是 实现垂水平直居中的几种方法(1)定宽居中(absolute+maigin:auto)position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;<!DOCTYPE HTML><html><head> <meta charset="utf-8" /> <meta http-equiv="X-UA
2020-06-25 20:05:32
4575
原创 vue-admin-template搭建后台管理系统的学习（二）登录
此模版 用到的是mock模拟数据，在store中管理用户状态我们一步步改为我们自己想要的东西 即 在实际项目中我们是怎么实现登录的1.我们先找到这个登录页打开这个登录页在点击登录的时候有一个方法上面的图中 红框 部分 标记的意思是 在store文件中找到user文件中的login方法找到了这里就是处理登录的地方 我们往下看 会看到一个Login方法两个login 第一个是在store=>user中定义的方法用于将用户的状态存起来，第二个 就是我们的 请求了 看到这个就很熟悉来吧。
2020-06-21 17:28:09
1698
原创 vue-admin-template搭建后台管理系统的学习（一）目录结构
首先我们来看看这个基础模版的目录结构├── build // 构建相关├── config // 配置相关├── src // 源代码│ ├── api // 所有请求│ ├── assets // 主题 字体等静态资源│ ├── components // 全局公用组件│ ├── directive // 全局指令│ ├── filtres // 全局 filter│ ├── icons // 项目所有 svg icons│ ├── lang // 国际化
2020-06-21 17:22:06
1971
一款h5切水果小游戏，画面清晰 操作流畅
2020-08-05
wxMiniProgram.zip
2020-07-24
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人