前端
关注
分享
扫一扫
文章平均质量分 51
前端
xiaokanfuchen86
这个作者很懒，什么都没留下…
展开
-
react的render方法中进行条件渲染和遍历渲染
【代码】react的render方法中进行条件渲染和遍历渲染。原创 2024-09-29 23:12:30 · 257 阅读 · 0 评论 -
render props模式(children传参)
【代码】render props模式(children传参)原创 2024-09-29 21:58:42 · 151 阅读 · 0 评论 -
高阶组件(传递props)
鼠标当前位置：(x: {props.x}, y: {props.y})高阶组件// 设置displayName。// 该组件提供复用的状态逻辑。// 控制鼠标状态的逻辑。// 用来测试高阶组件。原创 2024-09-29 21:51:23 · 419 阅读 · 0 评论 -
React中Hooks使用
useReducer实现，useState的实现是基于useReducer。useReducer和useContext一起使用。原创 2024-09-29 19:57:55 · 650 阅读 · 0 评论 -
React Router中Link和NavLink的学习总结
react转载 2024-09-08 23:37:53 · 357 阅读 · 0 评论 -
react路由传参(3种方式)
react转载 2024-09-08 23:30:29 · 803 阅读 · 0 评论 -
React 路由传参的几种实现方法
react转载 2024-09-08 23:21:27 · 411 阅读 · 0 评论 -
一文解读exports、module.exports 和 export、export default
module.exports 模式下，module.exports 和 exports 的内容是完全不同的，module.exports 导出的是模块（hello.js）对象本身（类别Java，可以理解为导出的是一个类，而不是实例化的对象），在此场景下 exports 是空的（类比Java，理解为一个空对象，没有实例化就是null）。exports 对象是由模块系统创建的。exports 和 module.exports 的内容是完全一样的，换言之：exports 指向的是 module.exports。转载 2024-08-24 19:45:13 · 1969 阅读 · 0 评论 -
ES6 --- Promise基础用法（resolve、reject、then、catch）详解一
ES6— Promise基础用法详解Promise是一个构造函数，它自身拥有all、reject、resolve这几个眼熟的方法，原型上有then、catch等同样熟悉的方法。所以，在开始一个Promise的时候，先new一个吧：let p = new Promise((resolve, reject)=> { setTimeout(()=> { resolve('执行完成') }, 1000) })Prom..转载 2022-01-22 23:26:15 · 5837 阅读 · 0 评论 -
Promise中的then第二个参数和catch的区别
Promise中的then第二个参数和catch有什么区别？首页我们先要区分几个概念：reject是用来抛出异常的，catch是用来处理异常的； reject是Promise的方法，而then和catch是Promise实例的方法（Promise.prototype.then 和 Promise.prototype.catch）。一、区别主要区别就是，如果在then的第一个函数里抛出了异常，后面的catch能捕获到，而then的第二个函数捕获不到。catch只是一个语法糖而己 还是通过转载 2022-01-22 23:08:48 · 468 阅读 · 0 评论 -
jQuery ajax 文件下载
一般上文件下都会使用window.location.href='xxx' //文件路径或者 后台接口地址 但有时候要传递参数给后台就需要window.location.href='xxx?name=123&age=234' 如果传参过多或者传参长度过大就有点不太合理了jQuery.download = function(url, data, method){ // 获得url和data if( url && data ){ ...转载 2021-02-03 21:22:08 · 1802 阅读 · 0 评论 -
ajax读取头信息
jQuery$.get(url, function(data, statusTest, xhr){ console.log(xhr); console.log(xhr.getAllResponseHeaders());//获取所有的响应头消息 //console.log(xhr.getResponseHeader('server'));//获取服务器信息 let type = xhr.getResponseHeader("content-type") //获取原创 2021-02-03 21:15:46 · 698 阅读 · 0 评论 -
JQuery 实现文件下载的常用方法分析
本文实例讲述了JQuery 实现文件下载的常用方法。分享给大家供大家参考，具体如下：GET方式 1 window.location.href = url; POST方式 1 2 3 4 5 6 7 8 9 10 11 12 13 14 var url = "下载接口地址"; // 构造隐藏的form表单 var转载 2021-02-03 21:05:54 · 3803 阅读 · 1 评论 -
用html+css+js实现一个无限级树形控件
题目描述：用html+css+js实现一个无限级树形控件，功能如下：1.利用html、css展示一个树形菜单2.点击箭头图标展开子项3.点击父节点勾选图标能全选或全取消，点击叶节点勾选图标可以选中或取消思路：以上是一道题的题目描述，但是树形结构是如何给出的题目并没有说明，所以每个人都有不同的想法。（自己百度了一顿也没有百度到 (⊙⊙)）想法：1、假如给出的是一个json结构，可以用原生JavaScript解析生成相应的DOM树，由于树的嵌套级数是未知的，所以会递归地生..转载 2020-12-21 20:04:14 · 948 阅读 · 0 评论 -
无限级树形控件
<!DOCTYPE html><html><head><meta charset="utf-8"><title>菜鸟教程(runoob.com)</title><script type="text/javascript"></script><script src='jquery.js'></script><style type="text/css">...原创 2020-12-20 21:28:02 · 311 阅读 · 0 评论 -
自定义下拉框实现
实现思路：(1)创建一个列表和一个span之类的标签（那个标签都可以），(2)列表的每一项分别绑定点击事件，点击那一项就把span内容变为改那一项内容，然后隐藏列表。(3)列表要先隐藏，点击span标签再让它显示，什么都不选时点击document隐藏列表。(4)键盘上的按键都有各自的键码，通过这个键码可以来判断按下的是哪个键来执行相应的操作，下面函数可以获取键盘的键码document.addEventListener("keyup",function(e){ .转载 2020-12-15 21:45:42 · 560 阅读 · 0 评论 -
java项目中ocx控件的调用
很多javaweb项目中用到了和硬件设备交互的功能，如果仅仅靠java代码，是无法实现这个目标的，所以，可以在js代码中调用控件：<1>现在jsp页面使用div形式嵌入ocx控件，classid为标示符：<div><OBJECT id="Sadp_OCX" classid="clsid:8CAA6E82-3567-4FAA-BB76-6735E45E3B61" width=0 height=0 ></OBJECT></div><2>转载 2020-10-13 10:01:11 · 554 阅读 · 0 评论 -
js中调用ocx控件
项目中经常遇到js中要调用c++控件情况,通过控件来实现相关功能操作。如视频控件等具体js中引用 object的classid代码参考如下： <body id="body" onload="initLocalParam();init();" > <div id="div" style="width:100%;height:100%;"> <object classid="clsid:61978326-6772-4595-9EC3-D23C5...转载 2020-10-13 09:57:50 · 1010 阅读 · 0 评论 -
Vue自定义组件通过v-model实现父子组件双向同步通信
在vue官网2.2.0的api新增的model选项，可以帮助我们实现父子同步通信。1. modelmodel的类型定义如下，它有两个属性prop，event.一个组件上的v-model会把 value用作 prop把 input用作 event类型：{ prop?: string, event?: string }model: { prop: ‘value1’, // prop说:我要在该组件被使用(被父组件调用)时,v-model的值绑定给value1 event:..转载 2020-09-09 15:38:02 · 870 阅读 · 0 评论 -
vue中对于一个非表单元素使用this.$emit(‘input‘,name)的问题.
vue中对于一个非表单元素使用this.$emit('input',name)的问题.vue.js一个tab页组建，包括三个文件，在tabs.js中，为何要 this.$emit('input',name)？请输入代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=dev转载 2020-09-09 15:29:20 · 1384 阅读 · 0 评论 -
vue传参数：子传父 this.$emit(‘input‘,val)
子组件在传值的时候，选用input，如this.$emit(‘input’,val)，在父组件直接用v-model绑定，就可以获取到了如果你不用input，则需要常规的@方法获取值，并用jq代码给kcrid赋值。转载 2020-09-09 15:24:05 · 1374 阅读 · 0 评论 -
vue 组件中的 model: 允许自定义组件在使用 v-model 时定制 prop 和 event
<my-checkbox v-model="foo" value="some value"></my-checkbox> Vue.component('my-checkbox', { model: { prop: 'checked', event: 'change' },})Vue.component('my-checkbox', { model: { prop: 'checked', event: 'change'...转载 2020-09-09 15:14:32 · 3210 阅读 · 1 评论 -
Jest
1. 介绍Jest是 Facebook 的一套开源的 JavaScript 测试框架， 它自动集成了断言、JSDom、覆盖率报告等开发者所需要的所有测试工具，是一款几乎零配置的测试框架。2. 安装通过 npm 添加依赖： npm install --save-dev jest babel-jest babel-core babel-preset-env regenerator-runtimebabel-jest、 babel-core、 regenerator-runtim.转载 2020-08-22 12:51:38 · 100 阅读 · 0 评论 -
npm install -S | --save | -D | --save-dev | -g 说明
npm 安装包命令1、局部安装npm install <package_name> 说明 安装到当前项目npm 5x 以后 这个命令等同于npm install --save <package_name> 同时也是会同样写入到依赖 dependencies2、 全局安装 -gnpm install -g <package_name&...转载 2020-03-09 22:27:04 · 147 阅读 · 0 评论 -
js Array中 filter、map 的区别
两者都是数组原型链中的方法，方法是遍历数组，回调函数对遍历出来的对象进行操作，但两者的返回值有所不同var kvArray = [{ key: 1, value: 10 },{ key: 3, value: 20 },{ key: 2, value: 30 }];var mapResult = kvArray.map((v,i)=>{ return v.value = ...转载 2020-02-28 11:53:16 · 291 阅读 · 0 评论 -
ajax处理session过期
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Insert title here</title><script type="text/javascript" src="lib/jquery-3.4.1.min.js"></script...原创 2020-01-07 17:28:35 · 196 阅读 · 0 评论