- 博客(19)
- 收藏
- 关注
原创 react hook 中 父组件调用子组件中的方法
一,在父组件中声明一个refconst changeRef = useRef<any>()二,将ref作为参数传递给子组件<Compile id={topicId} onRef ={changeRef}></Compile>三,子组件接受ref 暴露出方法给父组件// 暴露给父组件的方法 useImperativeHandle(props.onRef,()=>({ changeVal:() => {
2021-08-18 14:44:47
371
原创 Vue 如何导出表格
首先安装两个依赖npm install -S file-saver xlsxnpm install -D script-loader下载两个JS文件然后在vue.config.js中,配置路径路径一定要对,不然找不到配置文件,项目会报错在这里插入代码片 exportBtn() { require.ensure([], () => { const { export_json_to_excel } = require('vendor/Export
2021-06-17 14:06:29
325
原创 Vue学习总结
Vue渐进式JavaScript框架优点易用:熟悉三剑客,可快速上手Vue灵活:在一个库和一套完整框架之间自由伸缩高效:20kb运行大小,超快虚拟DOMVue基本使用<body> <!-- 插值表达式,支持简单的表达式计算 --> <div id="app"> <div>{{msg}}</div> <div>{{1+1}}</div>
2021-05-13 18:01:22
265
1
原创 node学习总结
什么是Node.jsNode.js是基于Chrome V8引擎的JavaScript运行环境。终端终端是专门为开发人员设计的,用于实现人机交互的一种方式。终端中的快捷键↑ 小方键盘上 ,可以执行上一次的命令 键盘tab 快速补全路径 键盘esc 清空输入的内容 键盘cla cla清空终端中的内容 字符串Fs文件系统模块fs模块是Node.js官方提供的,用来操作文件的模板,它提供了一系列的方法和属性,用来满足用户的操作需求例如:fs.readFile()读取指定文件的
2021-05-08 18:42:43
302
原创 npm 无法创建文件问题,解决方案
使用npm下载全局模块或者第三方模块可能会出现权限问题npm i nodemon -g@vue/cli输入下行命令,后面增加管理员权限,即可
2021-05-05 13:01:23
886
原创 Ajax知识大全
URL统一资源定位符,用于标识互联网上每个资源的唯一存放位置。URL地址的组成部分客服端与服务器之间的通信协议存有该资源的服务器名称资源在服务器上具体的存放位置网页中的数据也是一种资源网页中的数据,也是服务器对外提供的一种资源。HTML是网页的骨架CSS是网页的颜值JS是网页的行为数据是网页的灵魂请求方式get请求通常用于获取服务器资源(要资源)例如:根据URL地址,从服务器中获取HTML CSS JS 数据资源等post请求通常用于提交数据资源(交资源)例如:
2021-04-27 11:34:20
217
原创 JS高级知识大全
两大编程思想面向过程就是,我们分析好步骤,一步一步进行实现的过程面向对象是以对象的功能来划分的,而不是步骤。ES6中的类和思想创建类:var xx = new name();类必须用new来进行实例化constructor()方法是类的构造函数,用于传递参数,返回实例对象,通过new命令生成对象实例时,自动调用该方法。语法:class Star { constructor(uname, age) { this.uname = u
2021-04-21 16:12:35
157
原创 JQ基础知识大全
jQuery通俗来说,就是一个JS的库,里面封装了很多的JS方法,可以使前端人员去调用,大大减少了开发的时间,增加了开发的效率。JQ的优点轻量级,核心文件才几十KB,不会影响页面的加载速度。跨浏览器兼容。基本兼容了现在主流的浏览器。链式编程,隐式迭代。对事件,样式,动画支持,大大简化了DOM操作。支持插件扩展开发,有着丰富的第三方的插件,例如:轮播图,树形菜单,日期控件等免费,开源。JQ的顶级对象‘’$‘’是JQ的别称,代码中科院用JQ代替它$是JQ的顶级对象,相当于JS中的wi
2021-04-10 08:44:16
11840
3
原创 2021-03-30
元素的偏移量offsetoffset 翻译过来就是偏移量, 我们使用 offset 系列相关属性可以动态的得到该元素的位置(偏移)、大小等。获得元素距离带有定位父元素的位置获得元素自身的大小(宽度高度)注意:返回的数值都不带单位 var father = document.getElementById("father"); var son = document.getElementById("son"); var bother = document.
2021-04-07 15:51:42
57
原创 WAPls.NO3
常用的键盘事件onkeyup 按键弹起的时候触发// document.onkeyup = function() {// console.log('我弹起了');onkeydown 按键按下的时候触发 能识别功能键 比如 ctrl shift 左右箭头啊 document.addEventListener('keypress', function() { console.log('我按下了press');onkeypress
2021-03-29 18:52:37
84
原创 WAPls-NO.2
**注册事件给元素添加事件,称为注册事件。注册事件的方式有两种,传统方式和方法监听注册方式传统方式特点:注册事件的唯一性同一个元素同一个事件只能设置一个处理函数,最后注册的函数会覆盖之前设置的函数。 var btns = document.querySelectorAll('button'); // 1. 传统方式注册事件 btns[0].onclick = function() { alert('hi'); }
2021-03-29 09:35:09
109
原创 WAPls. NO1
APIAPI是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或者某硬件得以访问一组历程的能力。又无需访问源码。通俗来讲:AIP是给程序员提供的一种工具,以便能轻松的实现想要实现的功能Web API是浏览器提供的一套操作浏览功能和页面元素的API。DOM文档对象模型—简称DOM。是HTML的标准编程接口。如何获取页面元素根据ID获取使用getElementByld()使用console.dir() 可以查看对象里面的属性和方法。根据标签名获取document.getEleme
2021-03-28 15:17:49
144
1
原创 JS-一些笔记
一在当前作用域下,JS代码被执行前。浏览器会把默认带有var function声明的变量在内存中进行提前声明或者定义;预解析:在当前作用域下, JS 代码执行之前,浏览器会默认把带有 var 和 function 声明的变量在内存中进行提前声明或者定义。代码执行: 从上到下执行JS语句。预解析只会发生在通过 var 定义的变量和 function 上。学习预解析能够让我们知道为什么在变量声明之前访问变量的值是 undefined,为什么在函数声明之前就可以调用函数。内置对象JavaScrip
2021-03-27 13:45:03
132
1
原创 初学JS第二天
JS运算符运算符(operator)也被称为操作符,用于实现赋值,比较和执行算数运算等功能的符号一、 算数运算符加号 + 例 10+10=20;减号 - 例 20-10 =10;乘号 * 例 10*10=100;除号 / 例 10/10 =1;取余 %例 9%2=1;算数运算符具有优先级,与传统数学运算符层级一致;二、递增与递减运算符递增(++)和递减( – )在JS中,递增和递减可以放在变量的前面或者后面放在前面:我们称之为前置递增或递减运算符放在后面:我们称之为后置
2021-03-23 18:57:07
71
原创 JS初学第一天
JavaScript简称JS ,是一种编程语言。JS的组成包括三部分:ECMAScript(JS语法),DOM(页面文档对象模型),BOM(浏览器对象模型)。JS输入框alert:页面提示框。语法:alert(“你好,世界”)confirm:页面选择框。var 变量名=compirm(“单击“确定”继续。单击“取消”终止”);if(变量名){window.alert(“你好,世界”)}else{window.alert((“再见”)}prompt:页面输入框。var 变量名 =
2021-03-22 13:32:00
64
原创 2倍图,移动端布局—京东案例
二倍图如果放入的img图片的宽和高大于要放入盒子的宽和高,通常使用二倍图,background- size:x y 进行缩放显示,使img图片可以完全的展示在div盒子中京东案例在这里插入代码片```<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge...
2021-03-20 08:55:06
139
原创 3D动画属性及相关案例
3D动画坐标图如上透视perspective,透视可以将2D平面呈现出3D的效果。作为一个属性,设置给父元素,作用于所有3D转换的子元素。3D呈现transform-style:preserve-3d;使所有2D子元素呈现在3D的平面上。旋转木马`<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Comp
2021-03-18 18:13:42
111
原创 2D-animation 动画实现
animationanimation:动画名 运动时间 持续次数 运动曲线 延迟 ;aanimation-timing-function配置动画的时间;也就是说,通过建立加速曲线,动画如何在关键帧之间过渡。animation-delay配置元素加载时间与动画序列开始之间的延迟。animation-play-state使您可以暂停和恢复动画序列。盒子运行一周案例代码<!DOCTYPE html><html lang="en"><head>
2021-03-16 19:14:52
161
原创 transform 三个属性的基本应用
transform:translate偏移自身的属性(宽和高)不会影响其他元素的位置。transform:translate(X,Y)transform:rotate单位为deg + 顺时针旋转 -逆时针旋转可以加hover效果,通过transtion(过度)属性演示动画。transform-origintransform 属性通过 transform-origin属性来调整旋转中心,偏移中心,缩放中心 ,来实现2d动画transform-origin:()可以使用方位名次可以使用
2021-03-16 13:38:40
338
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人