前端
记录、积累
易de
日积月累
展开
-
表格内日期比较计算
日期大小比较原创 2023-09-25 14:15:08 · 1068 阅读 · 0 评论 -
$attrs,$listeners
通过$listeners在c组件触发了A组件的方法。'通过$listeners触发父组件的事件''这是父组件的方法''这是子组件的方法''这是孙组件的方法'原创 2023-08-31 15:54:56 · 391 阅读 · 0 评论 -
provide/inject
Vue中的provide/inject是一种组件间通信的方式,它允许父组件向子组件传递数据,而不需要通过props或事件来实现。在父组件中,我们可以通过provide选项来提供数据,这些数据可以是任何类型的JavaScript对象。在子组件中,我们可以通过inject选项来注入这些数据,然后在子组件中使用它们。使用provide/inject的好处是可以避免props层层传递的问题,同时也可以让我们更方便地在组件树中共享数据。需要注意的是,provide/inject不是响应式的,也就是说,如果提供的原创 2023-08-31 14:03:22 · 115 阅读 · 0 评论 -
el-table实现跨页多选
el-tabel实现跨页多选原创 2023-02-18 15:46:24 · 859 阅读 · 1 评论 -
el-form表单验证-当某一项有修改后另一项为必填
el-form:表单验证原创 2022-12-19 15:00:00 · 843 阅读 · 0 评论 -
cookie、session、tooken三者区别与联系
cookie、session、token原创 2022-08-05 18:37:05 · 744 阅读 · 0 评论 -
微信小程序scroll-view去掉滚动条
微信小程序scroll-view去掉滚动条的解决方案原创 2022-06-14 17:27:52 · 9715 阅读 · 3 评论 -
overflow:hidden在移动端iOS失效的解决方案
overflow:hidden在移动端iOS失效的解决方案原创 2022-06-12 14:22:32 · 2863 阅读 · 0 评论 -
vscode新建uniapp项目
创建vue create -p dcloudio/uni-preset-vue uni-app2选择模板进入项目目录,运行 $ cd uni-app2 $ npm run serve原创 2022-02-23 15:19:05 · 626 阅读 · 0 评论 -
微信小程序
微信官方文档 · 小程序1. 开始注册,注册小程序账号,来管理自己的所有小程序项目。小程序注册页登录,登陆小程序管理后台,可以管理小程序的权限,代码发布等操作,在小程序管理后台可以看到小程序的AppID。安装开发者工具,在开发者工具下载页面,根据自己的操作系统安装对应的安装包。新建项目选择小程序项目,选择代码存放的硬盘路径,填入刚刚申请到的小程序的 AppID,给你的项目起一个好听的名字,勾选 “不使用云服务” (注意: 你要选择一个空的目录才可以创建项目),点击新建,你就得到了你的第一个小程原创 2022-02-22 18:01:43 · 728 阅读 · 0 评论 -
前端cookie封装
前端cookie封装 /* 存cookie */ export function setCookie (cname, cvalue, exdays = 0) { let expires = cname + '=' + escape(cvalue) if (exdays > 0) { let d = new Date() d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000)) ex原创 2022-02-15 11:09:12 · 319 阅读 · 0 评论 -
vue 引入 jquery
vue中引入jquery安装jquery包npm install jquery --save配置vue.config.jsconst webpack = require('webpack');module.exports = { configureWebpack: { plugins: [ new webpack.ProvidePlugin({ $: "jquery", jQuery: "jquery", "win原创 2022-01-21 11:13:52 · 4595 阅读 · 1 评论 -
vue+echarts5 实现中国地图
vue + echarts5.0 实现中国地图原创 2022-01-17 18:05:11 · 7547 阅读 · 1 评论 -
js表格复制
function tableCopy(target) { // Selection 对象表示用户选择的文本范围或插入符号的当前位置。 const selection = window.getSelection(); // range 接口表示一个包含节点与文本节点的一部分的文档片段。 const range = document.createRange(); const copy = target.cloneNode(true); console.log(copy) co原创 2022-01-05 18:09:20 · 1319 阅读 · 0 评论 -
webpack相关
1. webpackwebpack是前端构建工具,就是把开发环境的代码转换为运行环境的代码,开发环境的代码是为了更好地阅读,而运行环境的代码是为了更快速的运行。两个环境的代码会有所不同,开发环境的代码经过混淆压缩,体积变的更小,而且对代码的执行也不会产生影响,这样再放在线上运行,会有更高的运行效率。通常需要构建工具处理以下几种情况:代码压缩将CSS、JS等混淆压缩,让体积变得更小编译语法编写CSS时使用的SCSS、LESS等,编写JS时使用的ES6、TypeScript等,这些是目前浏览器无法原创 2022-01-05 18:03:25 · 257 阅读 · 0 评论 -
根据不同的值表格单元格显示不同的背景色
<el-table id="table" :data="tableData" border style="width: 100%;height: 100%;" :header-cell-style="{ color: '#333', 'font-weight': '500'原创 2022-01-05 18:00:31 · 1506 阅读 · 0 评论 -
less的函数与循环
我们在有很多类名相似,属性也相似的情况下,定义每个类名,然后给每个类型添加属性,这样的代码很低效,我们可以选择用循环的方式写。<template> <div> <div class="up up1">up1</div> <div class="up up2">up2</div> <div class="up up3">up3</div> <div class="up u原创 2021-12-09 17:21:45 · 304 阅读 · 1 评论 -
vue + vant 组建loading的使用
在代码最后添加loading组建<template> <div class='detail'> <div class="nav-bar"> <van-nav-bar :border='false'> <template #title> <div class="home-title">标题</div> </template>原创 2021-09-29 15:16:25 · 9231 阅读 · 1 评论 -
修改超出div之后显示的滚动条的样式
通过一个demo来展示<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <原创 2021-09-20 19:20:28 · 406 阅读 · 0 评论 -
pdfjs-dist加载不全的解决方案
首先说版本问题,我用的2.1.226版本,会有长文章加载不全的问题,看了网上好多人说的,说是2.2.228版本的最稳定;可以看https://www.cnblogs.com/baisong11/p/13731436.html解决方案方案一:修改源码https://blog.csdn.net/s_y_w123/article/details/108869862方案二:线上或本地资源包https://www.cnblogs.com/KingJames/p/11763590.html我最开始使用了线原创 2021-09-16 19:00:05 · 7858 阅读 · 1 评论 -
SCSS基础了解
变量通过$符合去声明一个变量,通常存储css中要复用的样式,例如字体、颜色等。Sass 变量使用 $ 符号:$variablename: value;eg:$global-color: #efefef;$global-font-size: 14px;嵌套以嵌套的方式使用css下面的例子,ul,li,a都被嵌套在nav下面,nav相当于父级,只有在nav下的ul,li,a才会具有定义的样式。nav { ul { margin: 0; padding: 0; .原创 2021-09-14 18:05:59 · 262 阅读 · 0 评论 -
物理像素&CSS像素
1. 屏幕尺寸屏幕尺寸是手机屏幕的对角线的长度。5.2寸手机,是其对角线长为5.2寸。1英寸 = 2.54厘米2. 分辨率(物理像素)分辨率是屏幕上的像素点数,1920x1080分辨率的手机,表示其横向有1080个像素点,纵向有1920个像素点。这个值是每个手机出厂的时候就设定好的。3. 分辨率比1920x1080,比为16:9,这个值也可以看作是手机屏幕比。4. 屏幕像素密度PPI (pixel per inch),即每英寸长度所能显示的像素(pixel)的数目。PPI值越大表示显示屏能以原创 2021-09-09 18:42:36 · 465 阅读 · 0 评论 -
HTML&CSS案例---咖啡店
HTML&CSS案例—咖啡店最终页面效果页面结构为:最上面header是一个头部,主要是一张图片;下面的nav是一个导航栏,包含五个链接;下面是主体部分,左侧的上面是一个表格,下面是四张图片,当鼠标放到图片上会有一个放大的效果,右侧有4个div是四种咖啡的详细介绍;最下面有一个脚本。具体代码如下;HTML代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> &l原创 2020-07-13 16:03:05 · 5577 阅读 · 4 评论 -
3D变换案例
案例正面是图片,当鼠标悬停到图片上,背面出现文字。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>旋转</title> <style> *{ margin: 0; padding: 0; } body{ background-color:#0D3462; } /* 舞台 */ .co原创 2020-07-13 12:42:35 · 209 阅读 · 0 评论 -
2020-06-28-----下载bootstrap
bootstrap框架原创 2020-06-28 13:10:57 · 566 阅读 · 0 评论 -
2020-06-26-----HBuilder制作简单的调查问卷
HBuilder制作简单的调查问卷简单表格的练习;js实现重置表单;<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>微信依赖程度调查表</title> </head> <body> <form id="form" action="" method="post"> <h3 align="cen原创 2020-06-26 20:23:25 · 1469 阅读 · 0 评论 -
2020-06-26-----HBuilder写简易计算器(HTML CSS JavaScript)
HBuilder实现简易计算器主要是JavaScript的练习。<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> .cbody { width: 258px; height: 270px; margin: 0 auto; border: 1px solid blac原创 2020-06-26 19:14:11 · 6954 阅读 · 1 评论 -
2020-05-24-----CSS的边距(2)
CSS的边距(2)边距(有浮动的情况)块级元素.box1{background-color:tan;margin: 50px;float: left;/*当元素浮动时1.块级元素水平方向上的外边距叠加2.块级元素垂直方向上的外边距叠加3.子元素的top不再向父级元素传递*/}行级元素a{background-color: red;margin: 30px;float: left;/*当有浮动时上下外边距对行级元素起作用*/}示例代码<!DOCTYPE原创 2020-05-24 13:27:58 · 181 阅读 · 0 评论 -
2020-05-23-----百度首页设计
百度首页设计效果展示示例代码1.HTML部分<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>百度一下,你就知道</title> </head> <!--# 把CSS链接进来,也可以直接写在style标签里--> <link rel="stylesheet" type="text/css" href="css原创 2020-05-23 18:53:38 · 267 阅读 · 0 评论 -
2020-05-22-----CSS中的边距(1)
CSS中的边距(1)边距(没有任何布局属性的情况)块级元素.box1{background-color:tan;/*在无任何布局属性下1.块级元素垂直方向上的外边距重合,取二者较大的值2.子级元素的margin-top会传递给父级元素*/margin: 50px; 上下左右均为50}行级元素a{background-color: red;/*在无任何布局属性前提下1.上下外边距不作用与行级元素2.水平方向上外边距叠加*/margin: 30px;}示例代码&原创 2020-05-22 19:25:43 · 256 阅读 · 0 评论 -
2020-05-16-----CSS中的选择器(2)
CSS中的选择器(2)选择器(8种)内部样式,写在style标签里。1-56./ * 包含(后代)选择器 所有后代 */.box2 p{color: palegreen;}7./ * 子代选择器 只找第一代子代 */.box1 > p{color: paleturquoise;}8./ * 伪类选择器 *// * 在父级元素中找到第n个并且标签名为div的子标签n>0的自增整数 * /body div:nth-child(1){width: 20px;heig原创 2020-05-16 11:32:04 · 174 阅读 · 0 评论 -
2020-05-15----CSS中的选择器(1)
选择器选择器内部样式,写在style标签里。1./*通配选择器 */ *{ margin: 0; }2./*标签选择器 */ div{ width: 100px; height: 100px; background-color: red; }3./*id选择器 */ #box{ width: 100px; height: 100px; ba...原创 2020-05-15 11:10:35 · 206 阅读 · 0 评论 -
2020-05-14-----CSS中的position
position定位/relative 相对定位。(1)它并没有什么用(它不会改变标签的任何状态)。(2)当子集有绝对定位 而又不改变其原有的排列方式/。/absolute 绝对定位。(1)当父级元素有定位属性时相对于父级元素。(2)当父级元素没有定位属性时向更高一级查找,直到找到定位属性或absolutebody为止。(3)同级元素之间互不干扰。position: fixed...原创 2020-05-14 16:21:26 · 121 阅读 · 0 评论