- 博客(28)
- 收藏
- 关注
RSS订阅
1原创 JS实现：数组中的json对象，按某个字段来进行字母排序
记录一下，有问题欢迎指出~！1.定义排序的函数function sortList(arr,flag){ return arr.sort((a,b) => { return a[flag].localeCompare(b[flag]) })}2.举例// 假设要处理的数据格式如arr一样const arr = [{level:'A'},{level:'C'},{level:'F'},{level:'B'}]// 执行方法sortList(arr,'level')// 返
2021-11-29 15:21:13
937
原创 vue中如何配置全局过滤器及分享字符串连接的方法
一、在src下创建filters文件夹，在index.js中定义方法：（1）在创建的index.js中写入这个连接字符串方法：export function listJoin(list, key, joinStr) { let result = '' const strArray = [] for (const item of list) { strArray.push(item[key]) } result = strArray.join(joinStr) retur
2021-04-14 23:37:01
267
原创 vue实现多选和取消多选的效果
一、要实现的效果1.当点击“全选”时，能全选所有；2.点取消掉列表的某个input框时，“全选”框不被选择；二、html结构前提： v-for循环遍历list，列表中的每个item都有checked属性，用v-model绑定item.checked；input标签有change方法，当值改变时生效（1）单选：<div v-for="(i,index) in list"> <input type="checkbox" v-m
2021-04-14 23:09:44
867
原创 每天20道前端面试题（一）
1.CSS选择器的优先级排序，怎么计算权值？1.选择器：如何选择标签（同样的选择器后写的生效）2.选择器的分类：*：通配符选择所有标签标签名选择器：直接选择标签名类名选择器：.+类名(标签可以有多个类名，用空格隔开，但不能书写多个class属性，只能有一个class属性)交集选择器：.one.two（class=“one two”）p.one ，.one.two为one和twoid选择器：#id（id=“one”）//取id类似于身份证（权重很高）并集选择器：用逗号隔开【如果样式都
2020-08-16 01:57:32
497
原创 Flex的使用
主要是总结了一下Flex的各个属性，有些例子可能不大能实现，当时瞎写的，还是先来看看大神的笔记吧：阮一峰：http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html01 Flex的定义和使用1.Flex 是 Flexible Box 的缩写，意为"弹性布局"，用来为盒状模型提供最大的灵活性；2.任何一个容器都可以指定为 Flex 布局。3.采用 Flex 布局的元素，称为 Flex 容器（flex container），简称"容器"。它的所有
2020-08-11 00:31:09
237
原创 es6相关知识点总结+示例
02 变量扩展<!DOCTYPE html><html><head> <title></title></head><body><!--ECMAScript6.0简称ES6，它的目标，是使得JavaScript语言可以用来编写复杂的大型应用程序，成为企业级开发语言--><!--ECMAScript 和 JavaScript 的关系是，前者是后者的规格，后者是前者的一种实现（另外的 ECMA
2020-08-11 00:18:15
248
原创 Vue框架——基本知识点+示例（4）
01 路由定义<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><!--1.组件定义组件组件嵌套组件传参spa最直观的一个页面只有一个html--><style>/*<!-- 默认类 用户点击到当前的内容,自动添加的类--
2020-08-10 01:09:30
263
原创 Vue框架——基本知识点+示例（3）
01 transition1.v-on：事件 可简写为 @事件名字；2.选择标签.click() 自动触发click方法<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>transition</title></head><style> p{ width: 100px;
2020-08-10 00:47:09
331
原创 Vue框架——基本知识点+示例（2）
01 总结使用vue1.引入框架；2.实例化对象；3.配置参数;**vue指令v-cloakv-if 和 v-showv-html 和 v-textv-pre 和 v-oncev-modelv-bindv-onv-for02 发微博<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title&g
2020-08-10 00:13:30
285
原创 Vue框架——基本知识点+示例（1）
03 vue相关问题第一步：引入框架< script src=“js/vue.js”></ script>第二步：body中写入元素< div id=‘app’>{{msg}}</ div>第三步：实例化对象new Vue({ el:’#app’ //绑定元素 data:{ msg:‘Hello Vue!’ }})<!DOCTYPE html><html lang="en"><hea
2020-08-09 23:35:59
422
转载 常见几种浏览器兼容性问题与解决方案
为了方便自己能随时看，重复记忆，所以把百度里的文章转载过来啦！文章转载自：https://jingyan.baidu.com/article/d169e1864f9c53436611d8eb.html所谓的浏览器兼容性问题，是指因为不同的浏览器对同一段代码有不同的解析，造成页面显示效果不统一的情况。 在大多数情况下，我们的需求是，无论用户用什么浏览器来查看我们的网站或者登陆我们的系统，都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题。在学习浏览器兼容性之前，.
2020-08-09 22:13:02
753
原创 React框架——入门知识点总结+示例（3）
08 React包使用1.快速构建React开发环境（自己先新建一个文件夹–>cmd）$ cnpm install -g create-react-app //安装create-react-app$ create-react-app my-app //创建项目my-app$ cd my-app/$ npm start //启动服务搭建完成后会有：具体可参考：https://blog.csdn.net/qtfying/article/details/786656642.初使用进
2020-08-09 01:56:06
533
原创 React框架——入门知识点总结+示例（2）
05 事件书写1.事件绑定和this指向绑定事件：on+事件名字Click（首字母大写）/ onMouseEnter={this.函数名}<body> <div id="app"> </div> <script type="text/babel"> //1.类定义组件 class Child extends React.Component{ constructor(){
2020-08-04 02:12:43
216
原创 React框架——入门知识点总结+示例（1）
React框架01体验react1.搭建结构注意点：1.（重点）引入两个文件；2.创建绑定元素；3.在script里创建组件<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>React测试</title> <script src="https://cdn.staticfile.org/react/16
2020-08-03 01:07:34
517
原创 前端中容易遗忘的小知识点(2)
05 深拷贝 和 06浅拷贝浅拷贝：把对象的属性一一赋值，不考虑属性的值的类型获取属性值：对象.属性或者对象[‘属性’]（属性是常量）/ （属性是变量）对象[属性]深拷贝：考虑对象的值，如果值是对象需要解析赋值a instanceof b：判断a是否是b的实例<!DOCTYPE html><html><head> <title>06深拷贝</title></head><body> <sc
2020-08-02 01:58:44
204
原创 前端中容易遗忘的小知识点(1)
01函数节流①什么是函数节流？某些代码不可以在没有间断的情况连续重复执行②为什么要实现函数节流？防止用户随意操作，导致程序运行缓慢（DOM操作比起非DOM交互，需要更多的内存和CPU时间，连续尝试过多的DOM操作可能会导致浏览器挂起，甚至崩溃）③如何实现函数节流？使用单词定时器可以实现函数节流（第一次调用函数，创建一个定时器，在指定的时间间隔后运行代码；当第二次调用该函数的时候，它会清除前一次的定时器并设置另外一个）02事件委托①什么是事件委托？事件委托就是利用冒泡的原理，把事件加到父级
2020-07-31 02:30:14
276
原创 使用node搭建服务器（wifi连接查看vue项目）
一、使用wifi连接node平台搭建的服务器，进行vue项目查看的步骤最近新学了node搭建服务器，步骤比较多，怕忘记了，按操作顺序记录下来供参考1.首先找到vue项目的文件夹，在上方输入“cmd”命令2.输入“npm run build”命令进行打包（用vue脚手架生成的项目，直接这么写，不然要去package.json里配置快捷键）3.打包完成，生成了dist文件夹4.复制这三个文件夹data文件夹：我放的是项目需要用的json、images；dist文件夹：打包生成的文件夹；i
2020-07-21 23:27:36
1237
原创 如何在Gitee上直接查看上传的项目
1. 点开项目页面，点击“服务”2.点击“Gitee Pages”3. 直接点“启动”按钮4. 出现网址，直接点击进入，即可查看
2020-07-21 22:13:15
2435
原创 如何获取网页logo与favicon图标使用
如何获取网页logo与favicon图标使用favicon图标介绍：favicon.ico一般用于作为缩略的网站标志,它显示位于浏览器的地址栏或者在标签上,用于显示网站的logo,如图红圈的位置， 目前主要的浏览器都支持favicon.ico图标.一、logo和ico图标获取1. 直接从其他网页中获取logo：关于网站图标的简单提取：直接在网址后面加上 /favicon.ico 就可以了2. 制作ico图标： http://www.bitbug.net/二、favicon图标使用当成功生成f
2020-07-12 21:05:52
3698
原创 Mixly呼吸灯及可调灯
1.呼吸灯会由暗到亮变化，像呼吸一样有节奏，起到一个通知的作用（1）代码块（2）实验效果呼吸灯变亮呼吸灯变暗2.可调灯（通过按钮调节档数，调节灯的亮度变化）（1）代码方法一方法二（2）实验效果微亮更亮最亮灯灭...
2019-10-29 18:43:55
787
原创 Mixly遥控调光器
红外线控制LED灯1.测试各个按钮的数据FFA25D:CH-FF629D:CHFFE21D:CH+2.代码部分（还需改进）3.实验效果调亮灯光
2019-10-23 17:50:26
194
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人