自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(30)
  • 资源 (1)
  • 收藏
  • 关注

原创 element-ui表格高度自适应(el-table 自适应高度)

想让element-ui的表格 el-table 出现滚动条的时候,如果不做处理就只能是 height="XXXpx",给它一个固定的高度,我们的页面正常情况下,是不允许出现页面级滚动条的,也是不美观的,想让table自适应高度并且有滚动条,而且不会出现页面级滚动条,可以这么实现,下面是我写的一个小组件,如果你明白了他的原理,就可以灵活运用在你自己的项目中了。

2023-02-01 14:32:35 3954 1

原创 设置Cookie过期时间

function setCookie(Cname, Cvalue, ExpiresTime) { const date = new Date() // 获取当前时间对象 const day = 1000 * 60 * 60 * 24 // 计算 一天 = 多少毫秒 date.setTime(date.getTime() + day * ExpiresTime) // 获取当前时间戳在加上(过期时间 * day变量)

2021-06-21 17:12:17 469

原创 js算法面试题

计算数组重复元素let arr = [1, 2, 3, 444, 4, 4, 4]//使用循环function repeatNum (arr, nuber) { let newarr = [] while (arr.indexOf(nuber) >= 0) { let index = arr.indexOf(nuber) newarr.push(arr[index]) arr.splice(index, 1) } return newarr.length

2021-06-10 20:24:19 203

原创 实现react懒渲染

react懒渲染组件的使用react-virtualized 组件

2021-06-07 22:43:32 351 1

原创 解决富文本编辑器(wangeditor)在vue项目中不能双向数据绑定(v-model)的问题

将富文本编辑器封装成一个组件首先要明白一个原理,vue中的v-model指令(双向数据绑定)其实这是一种语法糖,它只是给其绑定节点添加了一个input事件,并且给他添加了一个value属性,数值发生变化,他会更新data中的数据,在更新节点的value,从而实现双向数据绑定。/src/component/Editor/index.vue组件代码<template> <div> <div id="seditor" ref="seditor" @input="c

2021-05-21 19:00:41 4728 2

原创 Vue原理分析

Vue原理分析(数据响应式)一、js属性拦截器js属性拦截器(Object.definePropert)Objeck.definePropert: 属性拦截器,无论在获取对象的属性的值,或者为对象属性赋值的时候,都会进行拦截,然后做想要的操作用法:let data={}//使用Object.defineProperty()为data对象注册一个属性Object.defineProperty(data,'name',{ // 当对象中的name属性被外部获取时会触发get函数 g

2021-05-21 10:48:16 94

原创 深圳马的 50G 半年免费对象存储,你确定不要吗?

腾讯云对象存储实现文件上传(前端实现过程)使用步骤:登录或注册腾讯云账号然后进行实名认证搜索对象存储并开通(新用户免费送50G)找到存储桶列表创建存储桶创建秘钥进入控制台搜索访问管理并进入新建秘钥等待创建成功SecretId,SecretKey 分别为秘钥id 和keykey值显示需要进行验证设置跨域点击对象存储中的存储桶列表,再点击存储桶列表中的,某个存储桶名称点击安全管理=>跨域访问CORS规则设置为

2021-05-14 14:23:03 514 5

原创 vuex持久化插件(vuex-persistedstate)

一、使用插件解决vuex数据刷新丢失使用vuex的插件在使用vuex-persistedstate 插件这个插件其实也是使用本地缓存来储存store中的属性安装vuex-persistedstate插件npm install vuex-persistedstate --save在store中的index.js中引入import persistedState from 'vuex-persistedstate'let create_persistedstate = persisted

2021-05-06 19:51:08 3148

原创 js冒泡排序(自行理解)

let arr = [3, 4, 522, 233, 654, 1, 12, 2, 32, 94, 23, 30, 45, 46, 76] for (let i = 0; i < arr.length - 1; i++) { for (let y = 0; y < arr.length - 1 - i; y++) { if (arr[y] > arr[y + 1]) { let num = arr[y] arr[y] = arr[y

2021-05-06 19:01:34 76

原创 Vue的单向数据流你了解吗?

什么是单向数据流?组件中的父组件向子组件使用prop进行传值,这个可以称为一个单向数据流,父组件的值发生变化时,子组件的prop的值也会进行更新,这种现象可以称为单向向下的数据绑定(单向下行绑定)看一个简单的例子进行了解一下:子组件:<template> <input type="text" :value="text" /></template><script>export default { name: 'my-input', pr

2021-05-03 16:06:38 563 2

原创 Vuex核心概念

Vuex 学习笔记1.Vuex是什么Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化。每一个 Vuex 应用的核心就是 store(仓库)。“store”基本上就是一个容器,它包含着你的应用中大部分的状态 (state)。Vuex 和单纯的全局对象有以下两点不同:Vuex 的状态存储是响应式的。当 Vue 组件从 store 中读取状态的时候,若 store 中的状态发生变化,那么相应的组件也

2021-04-28 19:37:46 131 1

原创 文字超出隐藏使用省略号表示(可多行)

.title{ /* color: #FFFFFF; */ line-height: 1.2; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;}-webkit-line-clamp属性控制从第几行开始超出隐藏

2021-04-26 15:12:15 175 1

原创 js 扩展运算符你研究了吗?

今天看Es6的新特性,看到这个扩展运算,突然想试一试将数组展开后,放到对象中,因为数组展开后他只有单个值,但是在对象中都是键值对存在,就在想数组展开放在对象中是啥样的,果然值的研究,虽然我觉得没啥用,可能是我没有应用场景,事物存在定有道理。扩展运算符【 … 】扩展运算符能将 数组 转换为逗号分割的 参数序列运算完之后它不能直接暴露在外边,必须使用数组,对象进行包裹,或者直接console.log() 输出它const arr2 = [1,2,3]console.log(...arr) /

2021-04-15 20:11:27 90 1

原创 如何在微信小程序中如何使用外部组件

微信小程序中使用Vant组件参考vant文档:https://youzan.github.io/vant-weapp/#/home一、安装Vant初始化npm在项目的根目录打开终端npm init -y使用npm进行安装二、配置json文件首先要删除 app.js 文件中的 style修改project.config.json 文件 "packNpmManually": true, "packNpmRelationList": [ {

2021-04-12 19:28:56 335

原创 数字每三位加一个逗号方法

写一个方法统计一个字符串在另一个字符串中出现的次数var parent = 'abababab'function num(child){ return parent.split(child).length-1}console.log(num('a'))写一个js函数,实现对一个数字每3位加一个逗号(不考虑负数和小数)let setdou=(number)=>{ let numArr = (number+'').split('').reverse()

2021-04-07 10:46:12 2342

原创 npm切换镜像源

NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题,常见的使用场景有以下几种:允许用户从NPM服务器下载别人编写的第三方包到本地使用。允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。由于新版的nodejs已经集成了npm,所以之前npm也一并安装好了。同样可以通过输入 “npm -v” 来测试是否成功安装。命令如下,出现版本提示表示安装成功:[外链图片转存失败,源站可能有防盗链机制

2021-03-23 15:22:36 619

原创 css基础

今天复习了css的基础知识,整理了一下css基础复习核心概念和知识点语法:css的核心功能是将css属性设定为特定的值,一个属性与值的键值对,被称为声明,如果有多个声明要用{}包裹起来。使用{}包裹起来想后要效果生效,要使用css选择选择器将其与HTML元素绑定,选择器和声明块组成了css规则集(css ruleset)css注释/* 单行注释 *//* 多行 注释*/@规则css规则是样式表的主体,通常样式表会包括大量的规则列表。但是有时候也需要在样式表中包括有一些其他

2021-03-22 21:54:56 153 2

原创 数组去重

javascript数组(Array)删除相同的元素let arr = [11, 23, 44, 11, 33, 55, 33, 22, 23]let newarr = []arr.forEach(item => { if (newarr.indexOf(item) == -1) { newarr.push(item) }})console.log(newarr)javascript数组(Array)输出有重复的元素let arr = [11, 23, 44, 11,

2021-03-19 18:01:11 54

原创 js异步问题

js中分为同步和异步代码js 代码执行规则为:从上到下执行同步代码马上执行异步代码先放到异步代码队列中,等待同步代码执行完毕后再去执行使用promise进行修饰改造(使用node进行演示)如果像下面代码:const fs = require('fs')var a = ''fs.readFile('./fs/fs.text', 'utf8', (error, res) => { a = res})console.log(a) //此时的输出,a变量肯定是空的,因为读取文件

2021-03-17 13:21:42 323 10

原创 数字每三位加一个逗号

用js实现,对数字每三位加一个逗号let setdou=(number)=>{ let numArr = (number+'').split('').reverse() let newstr = '' numArr.forEach(function(item,index){ if((index+1)%3 == 0 && index+1<numArr.length){

2021-03-09 20:49:54 386

原创 js模块化

一、何为模块化?javascript中,有两种格式的模块,一种是Node.js专用的CommonJS模块,简称CJS,另一种为,ES6模块简称ESM。二、两种模块的差异(CommonJS和ESM)、CommonJS是使用require()方法引入,module.exports进行抛出,而ESM是使用import引入,export抛出CommonJS是同步执行的,而ESM是异步执行的!三、node中模块分类在nodejs中,应用有模块组成,一个js文件就是一个模块,每个js文件都是一个独立的作

2021-01-28 19:47:52 182 2

原创 nodejs连接数据库

1、下载模块使用npm下载mysql模块npm install mysql --save //--save代表自动把模块和版本号添加到devdependencies部分2、引入mysql模块//声明一个变量用来接收引入模块var mysql = require('mysql')3、创建一个数据库连接//声明一个变量接收var connection = mysql.createConnection({ host :'localhost', //主机域名,默认是localho

2021-01-27 16:40:27 1111 10

原创 js的this指向

this指向普通函数:this指向的是window对象 function f1(){ console.log(this) } f1() //输出是window对象构造函数:this指向的是实例化对象,原型对象里面的方法也是指向实例化对象 function F1(){ console.log(this) } F1.prototype.run=function(){

2020-12-23 15:16:01 293 5

原创 css弹性布局总结

css静态页面搭建总结弹性布局弹性布局很方便,可以快速的搭建出想要的布局1、header部分效果图:实现思路:一个header部分html结构是使用一个版心里面两个div一个是logo另一个是nav导航,样式搭建好后,使用弹性布局,给版心加:display:flex;justify-content:space-between;两端对齐,刚好两个div占在版心左右两端,然后,如果想垂直居中的话再设置align-item:center;可以快速搭建出布局,不用使用浮动,不用使用margin去挤。

2020-12-08 14:10:56 170

原创 javascript基础switch条件分支语句

javascript基础switch条件分支语句一、switch语法://我们先来看一下如果用if来写一个条件语句var a=prompt("请输入:");//将输入的值转换为整数类型var num=Number(a)//如果num值等于数字1,那么浏览器页面会出现一个字符串“一”if(num==1){ document.write("一")}//如果num值等于数字2,那么浏览器页面会出现一个字符串“二”if(num==2){ document.write("二")}

2020-09-23 09:15:12 263

原创 Javascript 数组基础

Javascript Array(数组)对象,基础1、什么是数组?数组对象的作用是:使用单独的变量明来储存一系列的值。2、创建数组,为其赋值,三种方式//第一种方式:var name=new Array();//声明一个变量给他赋值为一个数组name[0]="小明";name[1]="小月";name[2]="小雨";name[3]="小风";//第二种方式var name=new Array("小明","小月","小雨","小风")//第三种方式var name=["小明","小

2020-09-22 11:05:18 104

原创 2.javascript标识符

javascript标识符在js中所有的可以由我们自己命名的都可以称为是标识符。例如:变量名、函数名、属性名都是属于标识符命名一个标识符时需要遵守的规则:1.标识符中可以含有字母、数字、_下划线、$2.标识符不能以数字开头3.标识符不能是ES中的关键字或者是保留字4.标识符一般都采用驼峰命名法:首字母小写,每个单词的开头大写 ,其余字母小写。例如:helloWord小写。例如:helloWordJS底层保存标识符时实际上是采用的Unicode编码,所以理论上讲,所有的u

2020-09-09 11:26:40 503

原创 Javascript字面量和变量通俗易懂

Javascript字面量和变量一、字面量字面量都是一些不可改变的值比如:1 2 3 4 5 6字面量都是可以直接使用的,但是我们一般不会直接使用字面量二、变量变量可以用来保存我们的字面量,而且变量的值是可以任意改变的,变量更加方便我们的使用,所以在我们们开发当中都是通过,变量来保存我们的字面量,特别少的时候会直接使用字面量2.1声明变量在JS中使用var关键字来声明一个变量,给变量赋值。可以通过变量对字面量进行描述浏览器器返回结果为:...

2020-09-08 10:30:19 147

原创 js的基础语法需要注意的小细节

javascrip基础语法一、js注释多行注释,注释中的内容不会被执行,但是可以在源代码中查看要养成良好的注释习惯,也可以通过注释,来对代码进行调整<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">

2020-09-08 09:54:01 128

原创 css基础

css基础一、CSS样式行内样式就是在标签里面添加style样式,代码结构如下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</

2020-09-07 16:49:39 100

css的grid网格布局

grid布局的所有属性

2021-06-02

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除