- 博客(73)
- 收藏
- 关注
原创 vue遍历中存在el-form 之踩坑
初版:<template> <div class="message-templete-style"> <div class="title">短信通知模板 <el-tooltip popper-class="tooltip-style" content="请到阿里云短信平台申请短信权限" placement="bottom"> <i class="h-icon-help" :offset="85"><.
2022-03-28 20:46:54
1707
原创 vue换行符不生效
回车符在html标签中默认转化为 \nconst msg = ‘aaaaaaaaa\nbbbbbbbbb’{{ msg }}效果:aaaaaaaaabbbbbbbbbb解决办法:一:为div添加样式:white-space: pre-wrap 即可{{ msg }}或者二:将 \n 替换成 ,const msg = str.replace(’/\n/g, ‘’) ...
2022-03-24 16:19:05
852
原创 4.4、includes、startsWith、endsWith
/* 传统上,Javascript只有 indexOf() 方法可用来确定一个字符串是否包含在另一个字符串中. es6 又提供了 3 种新方法: 1. includes() 返回布尔值,表示是否找到了参数字符串 2. startWith() 返回布尔值,表示参数字符串是否在源字符串的头部 3. endWith() 返回布尔值,表示参数字符串是否在源字符串的尾部 ...
2021-05-09 07:59:56
159
原创 11.4、有关Map的遍历应用
/* 结合数组的 map 方法、filter方法,可以实现 Map 的遍历和过滤 (Map 本身没有 map 和 filter 方法) */ const m1 = new Map().set(1, 'a').set(2, 'b').set(3, 'c') console.log(m1) // Map(3) {1 => "a", 2 => "b", 3 => "c"} const...
2021-05-09 07:59:39
121
原创 09_数组操作方法/10_数组位置方法/11_数组迭代方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Do
2021-05-09 07:59:14
99
原创 18_三栏布局
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Do
2021-05-09 07:59:00
64
原创 17_深拷贝
<script> // 1. JSON 方法实现 // _tmp 和 result 是相互独立的,没有任何联系,有各自的存储空间 let deepClone = function (obj) { let _tmp = JSON.stringify(obj); //将对象转换成json字符串形式 let result = JSON.parse(_tmp); //将转换而来的字符串转换为原生...
2021-04-24 08:42:09
85
原创 16_js取出两个数组相同
<script> let arr1 = [1, 2, 3, 4] let arr2 = [3, 4, 6, 7, 8]; let newArr = []; for (let i = 0; i < arr2.length; i++) { for (let j = 0; j < arr1.length; j++) { if (arr1[j] === arr2[i]) {
2021-04-24 08:38:21
146
原创 15_Generator应用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Do
2021-04-24 08:28:16
122
原创 15_22.Generator之next()、throw()、return()
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Do
2021-04-24 08:27:25
206
原创 14_Generator
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Do
2021-04-24 08:26:03
101
原创 13_for_of
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Do
2021-04-24 08:25:18
83
原创 13_Iteraotr
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Do
2021-04-24 08:23:40
79
原创 12_Reflect
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Do
2021-04-24 08:21:25
77
原创 11_proxy
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Do
2021-04-24 07:59:52
108
原创 10_hook
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>D.
2021-04-24 07:58:17
86
原创 08_数组方法/数组栈、队列方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Do
2021-04-14 23:23:17
84
原创 07_事件处理
// 事件处理/* 阻止默认事件: 传统的 HTML : 通过返回 false 的方式阻止默认行文。 React : 显式的使用 e.preventDefault 。 在这里,e 是一个合成事件。React 根据 W3C 规范来定义这些合成事件,所以你不需要担心跨浏览器的兼容性问题。 使用 React 时,你一般不需要使用 addEventListener 为已创建的 DOM 元素添加监听器。 React 恰恰与之相反,你只需要在该元素初始渲染的时候添加一
2021-04-14 23:19:19
92
原创 06_state&生命周期
const element = <h1>Hello,xxx!</h1>const domContainer = document.querySelector('#react_dom')ReactDOM.render(element, domContainer)// ====================================================// 时钟的例子:function tick() { const element.
2021-04-14 23:17:55
86
原创 05_组件&Props
// 组件允许你将 UI 拆分为独立可复用的代码片段,并对每个片段进行独立构思。// 组件,从概念上类似于 javascript 函数。它接受任意的入参(即 “props”),并返回用于描述页面展示内容的 React 元素。// 函数组件与 class 组件// 定义组件最简单的方式就是编写 javascript 函数:function Welcome(props) { return <h1>11111{props.name}</h1>}/* 该函数
2021-04-14 23:15:38
132
1
原创 04_react基础
// JSXconst element = <h1>Hello,world!</h1>/* 为什么使用jsx? jsx 是一个 javascript 的语法扩展, jsx 可以很好的描述 ui 应该呈现出它应有交互的本质形式。 jsx 可以生成 React 元素*/const name = 'jack'const element = <h1>Hello,{name}!</h1>ReactD
2021-04-14 23:14:25
68
原创 03_基本包装类型
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Doc
2021-04-14 23:12:52
70
原创 02_Function类型_作为值得函数
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Doc
2021-04-14 23:11:26
96
原创 01_dva
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Doc
2021-04-14 23:08:13
358
原创 工作笔记_ts
// 构造类型 T ,并将它所有的属性设置为可选的。 // 返回值表示输入类型的所有子类型。// Partial<T>// interface Todo {// title: string;// description: string;// }// function updateTodo(todo: Todo, fieldsToUpdate: Partial<Todo>) {// return { ...todo, ...fieldsT
2021-04-14 23:03:10
94
原创 客户端存储
Web应用允许使用浏览器提供的API实现将数据存储到用户的电脑上。这种客户端存储相当于赋予了Web浏览器记忆。比方说,Web应用就可以通过这种方式来“记住”用户的偏好甚至是用户所有的状态信息,以便准确的“回忆”起用户上一次访问的位置。客户端存储遵循“同源策略”,因此不同站点的页面是无法互相读取对方存储的数据,而同一站点的不同页面之间是可以互相共享存储数据的,它为我们提供了一种通信机制,例如:一个页面上填写的表单数据可以显示在另外一个页面中。Web应用可以选择它们存储数据的有效期。比如:采用临时存储可以.
2020-07-30 16:11:01
167
原创 22.1、Module的语法
/* Module 概述 javascript 一直没有模块体系。无法将一个大程序拆分成互相依赖的小文件,再用简单的方法将它们拼接起来。 其他语言都有这项功能,比如 Ruby 的 require、Python 的 import ,甚至连 css 都有 @import , 但是 javascript 没有任何对这方面的支持,这对于开发大型、复杂的项目而言是一个巨大的障碍 ...
2020-07-30 15:41:13
103
原创 js语言精粹学习笔记
/* 第三章 对象 javacript 的简单数据类型包括数字、字符串、布尔值、null、undefined 值。 其他所有的值都是对象。 数字】字符串、和布尔值 “貌似” 是对象,因为它们拥有方法, 但它们是不可变的。 javascript 中的对象是可变的键控集合,在 javascript 中,数组是对象,函数是对...
2020-07-30 15:39:35
121
原创 20.3、super关键字、类的prototype属性和__proto__属性
/* 20.3 super 关键字 super 这个关键字既可以当作函数使用,也可以当作对象使用。在这两种情况下,它的用法完全不同。 第一种情况,super 作为函数调用时代表父类的构造函数。es6 要求,子类的构造函数必须执行一次 super 函数。 作为函数时,super() 只能用在子类的构造函数之中,用在其他地方就会报错 */ class A {}...
2020-07-28 17:55:17
212
原创 20.1、class的继承
// class可以通过 extends 关键字实现继承,这比 es5 通过修改原型链实现继承更加清晰和方便 class Point { } class ColorPoint extends Point { } /* 上面的代码定义了一个 ColorPoint 类,该类通过 extends 关键字继承了 Point 类的所有属性哈方法。 但是由于没有部署...
2020-07-28 17:54:38
79
原创 19.1、class的基本语法
/* 19.1 简介 js传统方法是通过构造函数定义并生成新对象 */ function Point(x, y) { this.x = x this.y = y } Point.prototype.toString = function() { return '(' + this.x + ',' + t...
2020-07-28 17:53:48
84
原创 18.1、async函数
/* 18.1 含义: ES7 标准引入了 async 函数,使得异步操作变得更加方便,async 函数是是什么?用一句话来说,它就是 Generator 函数的语法糖 */ // 下面是一个用 Generator 函数,依次读取两个文件 var fs = require('fs') var readFile = function (fileName) { ...
2020-07-28 17:53:01
65
原创 17.1、Generator函数的异步应用
/* 异步编程对 Javascript 语言来说非常重要。 Javascript 语言的执行环境是 “单线程” 的,如果没有异步编程,根本无法使用,不然会造成卡死。 本章主要介绍 Generator 函数如何完成异步操作 */ /* 17.1 传统方法 es6 诞生以前,异步编程的方法大概有下面 4 种 ...
2020-07-24 15:08:50
175
原创 16.9、Generator与协程、Generator应用
/* 协程(coroutine)是一种程序运行方式,可以理解成 “协作的线程” 或 “协作的函数”。 协程既可以用单线程实现,也可以用多线程实现;前者是一种特殊的子例程,后者是一种特殊的线程。 */ /* 协程与子例程的差异: 传统的 “子例程” 采用堆栈式 “后进先出” 的执行方式,只有当调用的子函数完全执行完毕,才会结束执行父函数。 ...
2020-07-24 11:36:02
459
原创 16.1、Generator
/* 16.1.1 基本概念: Generator 函数是 es6 提供的一种异步编程解决方案,语法行为与传统函数完全不同。 对于 Generator 函数有多种理解解角度。 从语法上,首先可以把它理解成一个状态机,封装了多个内部状态 执行 Generator 函数会返回一个遍历器对象。 也就是说,Generator 函数除了是状态机,还是一个遍历器对象生成函数。返...
2020-07-24 11:35:13
81
原创 11.4、有关Map的遍历应用
/* 结合数组的 map 方法、filter方法,可以实现 Map 的遍历和过滤 (Map 本身没有 map 和 filter 方法) */ const m1 = new Map().set(1, 'a').set(2, 'b').set(3, 'c') console.log(m1) // Map(3) {1 => "a", 2 => "b", 3 => "c"} const...
2020-07-23 13:51:05
122
原创 11.3、Map数据结构
/* 11.3.1 Map 的含义和基本用法 Javascript 的对象(Object) 本质上是键值对的集合(Hash结构),但是只能用字符串作为键。这给它的使用带来了很大的限制 */ const data = {} const element = document.getElementById('myDiv') console.log(element) ...
2020-07-23 13:49:23
107
原创 11.2、有关Set的遍历应用
/* 扩展运算符(...)内部使用 for...of 循环,所以也可以用于 Set 结构 */ let set1 = new Set(['red', 'green', 'blue']) console.log(set1) // Set(3) {"red", "green", "blue"} console.log(...set1) // red green blue ...
2020-07-22 19:39:25
80
原创 11.1、Set数据结构
/* 11.1.1 Set基本用法: es6 提供了新的数据结构 ———— Set。 它类似于数组,但是成员的值都是唯一的,没有重复。 Set本身是一个构造函数,用来生成 Set 数据结构 */ const s = new Set() var arr = [2, 3, 4, 5, 2, 2] arr.forEach(ele...
2020-07-22 19:38:40
179
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人