- 博客(137)
- 资源 (1)
- 收藏
- 关注
原创 element-ui之el-image-viewer(图片查看器)
随着版本的更新Element UI新增了新的组件,例如:Image,没错今天被我发了Image下面可通过 previewSrcList 开启预览大图的功能。这是官方文档中有写的,但是我想不使用Image组件又想使用预览大图的功能是否可行呢?答案是当然可以。使用方法翻看了Image的源码,发现大图预览是一个小组件image-viewer,打开看看它的props,如下props: { urlList: { type: Array, default: () => [
2020-06-12 15:41:02
13720
11
原创 el-checkbox中使用indeterminate 状态
indeterminate 属性用以表示 checkbox 的不确定状态,一般用于实现全选的效果<template> <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox> <div style="margin: 15px 0;"></div> <el-che
2020-05-18 10:42:11
8735
转载 js删除字符串的最后一个字符三种方法
例如,字符串如下var basic = “abc,def,ghi,”;方法一:basic = basic.substr(0, basic.length - 1);方法二:basic = basic.substring(0, basic.length - 1);方法三:basic = basic.substring(0, basic.lastIndexOf(’,’));
2020-05-18 10:37:31
8114
原创 android,ios配置scheme,react-native获取url
scheme 是一种页面之间跳转的协议,不仅可以用于app之间进行跳转,还可以用于 H5 页面跳转到app页面。通过scheme协议,服务器可以定制化告诉App跳转那个页面,可以通过通知栏消息定制化跳转页面,可以通过H5页面跳转页面等。无论Android还是IOS,都可以通过在H5页面中打开 scheme 协议的地址,从而打开本地app。苹果手机中的APP都有一个沙盒,APP就是一个信息孤岛,相互是不可以进行通信的。
2022-10-26 15:24:04
7836
3
转载 Vue项目index.html中的<%= BASE_URL %>
在Vue中遇到很多url都用到了<%= BASE_URL %>这个东西。<%= BASE_URL %> // 项目根目录在 vue-cli 创建的一个项目中执行命令 vue inspect > output.js将会输出一个output.js文件,自动将 vue-cli 中对 webpack 的配置信息导出到 output.js 文件,会发现下面一段代码: new DefinePlugin( { 'process.env': {
2021-05-17 11:52:13
7748
转载 svn的安装、常用操作和STS搭建SVN过程
一.svn的下载安装下载地址:https://tortoisesvn.net/downloads.zh.html安装完不要忘记重启电脑安装完成后,按下鼠标右键,会看到如下界面:说明SVN已经安装成功了。二.SVN的常用操作三.在STS中搭建svn 1.下载SVN客户端和STS,安装过程百度下。 2.STS中安装svn插件
2017-12-01 11:18:23
7466
原创 页面的重新加载,页面的刷新及页面跳转
页面重新加载和刷新1、reload 方法,该方法强迫浏览器刷新当前页面。语法:location.reload([bForceGet])参数: bForceGet, 可选参数, 默认为 false,从客户端缓存里取当前页。true, 则以 GET 方式,从服务端取最新的页面, 相当于客户端点击 F5(“刷新”)2、 replace 方法,该方法通过指定URL替换当前缓存在历史里(客户端)的项...
2019-09-05 17:50:39
5186
转载 绝对定位居中
1、兼容性不错的主流css绝对定位居中的用法:.conter{ width: 600px; height: 400px; position: absolute; left: 50%; top: 50%; margin-top: -200px; /* 高度的一半 */ margin-left: -300px; /* 宽度的一半 */} 这种方法有一...
2019-09-30 16:55:30
4848
转载 HTML界面多语言切换
HTML你需要将所有想要翻译的模块部分的class中加上lang,然后自定义key。还需要有设置语言的按钮,class中添加translate,id用相应的代号。<button class="translate" id="en">English</button><button class="translate" id="zh">Chinese</bu...
2020-03-29 17:09:39
4245
1
原创 filters访问methods中的方法,methods中使用过滤器的方法
一、methods中使用过滤器的方法1.一种方法是采用全局过滤器设置全局的filter的方法Vue.filter(‘name’,function (val) {})在methods中使用全局的filter:Vue.filters['filterName'] (val)2.设置当前组件的方法filter: { functionName (val) { // logic process }}在methods中使用局部的filter:this.$options.filters
2021-01-09 15:27:41
3917
原创 vue-grid-layout 使用以及所有属性
vue-grid-layout作用下载及引入版本案例 以及所有属性作用1.实现桌面拖拽布局功能2.可调整每个部件的大小3.可以在不重新构建网格的情况下添加或删除小部件下载及引入下载install with npm // 用npm npm install vue-grid-layout --saveinstall with yarn // 用yarn yarn add vue-grid-layout引入import VueGridLayout from 'vue-grid
2021-08-30 10:34:06
3665
3
原创 webstorm安装bootstrap 3自动提示插件
1.打开webstorm的设置2.点击Plugins3.在搜索框输入bootstrap 3,之后点击Installed 安装,安装成功后重启webstorm4.需要使用的时候,按Ctrl+j,输入bs3-
2019-09-10 10:13:54
3319
2
转载 Vue项目 RSA分段加解密
一、引入JSEncrypt1.安装依赖npm install jsencrypt2.在main.js(需要引入的地方)引入import { JSEncrypt } from 'jsencrypt'3.前端公钥加密、后台私钥解密、请求来的数据后台公钥加密、前端私钥解密二、引入转码方法 // 16进制转byte数组function hexToBytes(hex) { for ...
2019-12-11 17:14:23
3263
1
原创 webstorm调整html,js代码换行缩进值
1.settings-》Editor-》Code Style下的HTML,Javascript2.点击Code Style
2019-09-18 09:29:18
3232
原创 vue中watch监听浏览器窗口大小的改变
<script>export default { data() { return { screenWidth: document.body.clientWidth }; }, watch: { screenWidth(newVal) { console.log('newVal', newVal); // console.log('old', old); // this.boxWscreenWidthidth
2020-12-23 11:31:12
3055
1
原创 定时任务(cron)表达式
6L 2002-2005:2002年至2005年的每月的最后一个星期五上午10:15触发;:在每天下午2点到2:55期间和下午6点到6:55期间的每5分钟触发;* MON-FRI:周一至周五的上午10:15触发;* 6L:每月的最后一个星期五上午10:15触发;* 6#3:每月的第三个星期五上午10:15触发;*:每天上午10:15触发;* *:每天上午10:15触发;
2023-04-09 10:56:42
2908
转载 vue 横纵向打印
用单选框来切换打印时的方向<div slot="footer" class="dialog-footer"> <el-radio v-model="isPortrait" label="1" @change="handleRadioChange">纵向</el-radio> <el-radio v-model="isPortrait" label="0" @change="handleRadioChange">横向</el-ra
2020-12-18 20:35:39
2904
7
转载 call 和apply的作用与区别
共同的作用:call和apply都是用来修改函数中this的指向问题;不同:传参方式不同。call方法可以传给该函数的参数分别作为自己的多个参数,而apply方法必须将传给该函数的参数合并成一个数组作为自己的一个参数。var name = 'Evan';var age = 20;var person = { name: 'Hillary', age: 19, sayIntroduce: function () { return "Hello, My name
2020-09-24 16:05:49
2863
转载 安装node.js 多版本安装
一、普通安装方式 https://blog.youkuaiyun.com/wxl1390/article/details/100573329二、多版本安装方式1.卸载已有的node.js2.下载nvm,官网地址,点开之后,点击releases下载1)下载之后打开压缩包,如图2)在C盘创建文件夹dev,在dev下面创建两个子目录nodejs,nvm,3)把压缩包中的内容解压到nvm中,在insta...
2019-12-27 14:58:57
2811
转载 vue的实例属性$options
this.$options 可以获取自定义属性时。用来获取data外面的数据和方法。<script>export default { name: "Test", data() { return { }; }, //在data外面定义的属性和方法通过$options可以获取和调用 name: "zs", age: 12, haha() { console.log("haha"); }, created() {
2021-09-01 10:57:42
2809
转载 vue 项目使用AES加密解密(ECB和CBC两种模式)
区别ECB: 是一种基础的加密方式,密文被分割成分组长度相等的块(不足补齐),然后单独一个个加密,一个个输出组成密文。CBC: 是一种循环模式,前一个分组的密文和当前分组的明文异或或操作后再加密,这样做的目的是增强破解难度。(不容易主动攻击,安全性好于ECB,是SSL、IPSec的标准)1.先安装 crypto-jsnpm install crypto-js --save-dev2...
2019-12-11 15:15:08
2593
转载 vue单独给body设置属性
这个页面创建前设置我的样式,销毁之前移除我设置的样式。//创建前设置beforeCreate () { document.querySelector('body').setAttribute('style', 'background-color:#efeff4;')},//销毁前清除beforeDestroy () { document.querySelector...
2019-11-25 11:30:11
2513
原创 HTML+CSS 鼠标悬停发光按钮
在b站上看的小视频,看着按钮悬停发光效果很好,写的描述很清楚。效果图index.html代码<!DOCTYPE html><html lang="zh-CN"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>HTML+CSS 鼠标悬停发光
2021-01-01 15:52:39
2445
1
转载 js插件中的中文乱码问题
1.首先查看你的程序页面的编码是什么字符编码的,如:gb2312还是utf-8类型的。这个你写的程序不会不知道。2.找到你下载的js文件,右击——选择打开方式——记事本。注意,不要把默认设置成记事本,只是用记事本打开。3.打开后单击菜单栏的文件选项——选择另存为。4.在弹出的保存窗口的最下面有一个编码类型,将这个编码类型选择为你的程序的类型。然后
2017-11-14 21:42:27
2301
原创 json对象的使用,添加属性,修改值
添加属性1、js创建一个对象或者在原有对象上添加一个已知属性,并给这个属性赋值,写法如下:let obj = {'a1':'a1'};obj['a2'] = 'a2';console.log(obj);//输出{'a1':'a1','a2':'a2'};2、添加一个变量属性,并赋值变量,写法如下:function add(name,value){ let obj = {"a1...
2019-11-21 16:22:59
2243
转载 Vue只提交表单中被修改的部分
需求在提交表单使用http的put请求进行数据更新时,只提交表单中被修改的数据,而不是提交整个表单解决获取表单数据时clone一份作为原始数据rawData在提交表单前将表单数据 formData 和 rawData 的数据进行比较将差异存放到新的对象 diffData 中,在提交表单时提交就行了实现(部分代码)template中的代码<template> <el-form ref="formRef" :model="form"> <el-for
2020-09-11 15:37:26
2184
1
原创 react-native-root-siblings 在应用的根元素之后添加兄弟元素
react-native-root-siblings 在应用的根元素之后添加兄弟元素
2022-08-09 16:23:57
2150
原创 el-input限制输入类型
oninput =“value=value.replace(/[^\d]/g,’’)” //只能输入数字oninput =“value=value.replace(/[^0-9.]/g,’’)” //只能输入数字和小数
2020-03-29 15:24:15
2109
1
转载 Vue路由切换后, 页面滚动位置不变BUG处理
问题描述: 在路由a的时候,滚动页面到x的位置,此时直接跳转路由b,会发现b页面竟然页停留在x的位置!解决方案①:监听路由直接在app.vue监测路由变化, 让body的滚动距离scrollTop=0/ scrollTo(0,0)export default { watch: { $route: function(to, from) { window.scrollTo(0,0); //document.body.scrollTop = 0; //doc
2020-12-16 14:10:11
2017
2
原创 mui.slide的相关用法
DOM构造结构<div class="mui-slider"> <div class="mui-slider-group"> <!--第一个内容区容器--> <div class="mui-slider-item"> <!-- 具体内容 --> </div> <!--第二...
2019-09-30 16:05:55
1989
转载 ES6标准中的相等比较算法 SameValue、SameValueZero
1、相等比较算法The Abstract Equality Comparison Algorithm ( ==)The Strict Equality Comparison Algorithm ( === )SameValue (Object.is())SameValueZero (暂未提供API)2、SameValue对于前端研发来说,== 和 === 比较算法肯定已经深入了解了。对于熟练使用ES6的小伙伴,多知道Object.is()这个方法:Object.is(NaN, NaN) //
2020-05-28 15:31:31
1929
转载 vscode常用快捷键
一、主命令窗 F1 或 Ctrl+Shift+P(俗称万能键) :打开命令面板。在打开的输入框内,可以输入任何命令,如下图(图片较大,如果查看不清晰,可以在图片上右键 “在新的标签页中打开图片”,查看原图,下同): 二、常用快捷键1、编辑器与窗口管理新建文件: Ctrl+N文件之间切换: Ctrl+Tab打开一个新的VS Code编辑器: Ctrl+Shift+N关闭当前窗口: Ctrl+W关闭当前的VS Code编辑器: Ctrl+Shift+W切
2021-01-03 15:07:08
1873
转载 js判断一个数组是否包含一个指定的值
1:array.indexOf 此方法判断数组中是否存在某个值,如果存在返回数组元素的下标,否则返回-1let arr = ['something', 'anything', 'nothing', 'anything'];let index = arr.indexOf('nothing');console.log(index) //结果是2array.includes(searchElement[, fromIndex]) 此方法判断数组中是否存在某个值,如果存在返回 true,否则返回
2020-05-18 10:47:58
1751
转载 vue动态路由,刷新页面空白问题
了,所以每次渲染页面的时候都要重新执行一下添加动态路由的方法。第一次进入页面会正常显示,但是点击刷新页面后会导致页面空白。在vue项目中采用动态添加路由的方式,
2023-04-09 16:45:14
1728
1
转载 vue 使用clipboard实现复制功能
在vue中使用clipboard.js 时候发现一个问题,如果移动端不是input或者button,则复制不成功,使用步骤如下:引入clipboard.jsnpm install clipboard --save在需要使用的组件中importimport Clipboard from 'clipboard';添加需要复制的内容<button class="tag-read" data-clipboard-text="我是可以复制的内容,啦啦啦啦" @click="copy"
2020-09-11 17:36:04
1673
原创 elementUI的el-scrollbar
概念el-scrollbar(滚动条组件):是Element UI隐藏组件注意事项:1.el-scrollbar的父层要有固定高度2.el-scrollbar的高度要设成100%3.如果出现横滚动条,添加overflow-x:hidden;属性el-scrollbar组件暴露了 native, wrapStyle, wrapClass, viewClass, viewStyle, noresize, tag 这7个 props属性props: { native: Boolean,
2020-09-28 16:19:37
1573
转载 数组去重的方法
1.将数组的每一个元素依次与其他元素做比较,发现重复元素,利用数组方法splice()删除重复元素 var arr = [1,23,1,1,1,3,23,5,6,7,9,9,8,5,5,5,5]; function norepeat(arr) { for(var i = 0; i < arr.length-1; i++){ for(var j = i+1; j < arr.length; j++){ if(arr[i]==
2021-03-16 10:26:30
1555
onload和jquery运行顺序
2023-03-17
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人