- 博客(41)
- 收藏
- 关注
RSS订阅
1原创 函数的命名
函数就是行为（action）。所以它们的名字通常是动词。它应该简短且尽可能准确地描述函数的作用。这样读代码的人就能清楚地知道这个函数的功能。一种普遍的做法是用动词前缀来开始一个函数，这个前缀模糊地描述了这个行为。团队内部必须就前缀的含义达成一致。例如，以 开头的函数通常会显示某些内容。函数以 XX 开始……总结：函数声明方式如下所示： 作为参数传递给函数的值，会被复制到函数的局部变量。 函数可以访问外部变量。但它只能从内到外起作用。函数外部的代码看不到函数内的局部变量。 函数可以返回值。
2022-06-23 20:55:37
755
原创 【无标题】
指令的作用主要用于DOM操作Vue实例/组件用于数据绑定、事件监听、DOM更新Vue指令主要目的就是原生DOM操作减少重复如果某个DOM操作你经常使用，就可以封装为指令如果某个DOM操作比较复杂，也可以封装为指令mixins混入的作用减少重复directives的作用是减少DOM操作的重复mixins的作用是减少data、methods、钩子的重复...
2022-04-22 22:55:12
70
原创 .sync 修饰符
场景描述爸爸给儿子钱，儿子要花钱怎么办，答：儿子打电话（触发事件）向爸爸要钱Vue规则 ：组件不能修改props外部数据Vue规则： this.$emit可以触发事件，并传参Vue规则：$event可以获取$emit的参数不要问我为什么有上面三条规则，尤雨溪定的由于这种场景很常见所以尤雨溪发明了 .sync,:money.sync="total"等价于 :money="total" v-on:update:money="total= $event"我们再讲事件的时
2022-04-15 14:56:56
523
原创 Vue模板里面有哪些语法
我们把HTML模板叫做template展示内容表达式{{object.a}}表达式{{n+1}}可以些任何运算{{fn(n)}}可以调用函数如果值为undefinde或者null 就不显示另一种写法为<div v-text="表达式"></div>HTML内容假设data.x值为<strong>hi<>strong><div v-html="x"></div>即可显示粗体的hi我
2022-04-15 10:11:36
112
原创 面试题computed和watch的区别
computed和watch的区别1.英文翻译成中文computed就是计算属性的意思，是用来计算出一个值的，这个值我们在调用的时候1、不需要加括号2、根据依赖缓存watch就是监听的意思1、immediat表示是否第一次执行这个函数2、deep2.各自描述（可用代码例子）...
2022-04-12 15:29:11
539
原创 computed -计算属性
用途被计算出来的属性就是计算属性例1：用户名展示例2：列表展示缓存如果依赖的属性没有变化，就不会重新计算getter / setter默认不会做缓存，Vue做了特殊处理如何缓存？看示例。这是示例，不代表 Vue这样实现...
2022-04-12 09:34:05
65
原创 Vue进阶属性
computered -计算属性不需要加括号它会根据依赖是否变化来缓存watch - 侦听一旦data变化，就执行的函数options.watch用法this.$watch用法deep，immediate含义directives - 指令内置指令 v-if / v-for / v-bind / v-on自定义指令，如v-focus指令是为了减少重复的DOM操作mixin - 混入重复三次之后的出路混入v.s.全局混入选项自动合并混入
2022-04-11 16:31:56
479
原创 data中有数组怎么办
你没法前提声明所有key示例1：数组的长度可以一直增加，下标就是key你看，你没有办法前提把数组的key都声明出来Vue也不能检测对你新增了下标难道每次改数组都要用Vue.set或者this.$set尤雨溪的做法篡改数组的api，见文档中【变异方法】章节这7个API都会被Vue篡改，调用后会更新UI总结：对象中新增的keyVue没有办法实现监听和代理要使用set来新增key，创建监听和代理，更新UI最好前提把属性都写出来，不要新增key但数组做不到【不
2022-04-11 16:07:17
256
原创 小结Object.defineProperty / 啥是代理（设计模式） / vm=new Vue({data:myData})
Object.defineProperty可以给对象添加属性value可以给对象添加getter/settinggetter/setting用于对属性的读写进行监控啥是代理（设计模式）对myData对象的属性读写，全权由另一个对象vm负责那么vm就是myData的代理（类比房东租房）比如myData.n偏要vm.来操作myData.nvm=new Vue({data:myData})1、会让vm成为myData的代理（proxy）2、会对myData的
2022-04-11 15:23:48
691
原创 【无标题】
前言提示：这里可以添加本文要记录的大概内容：例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。提示：以下是本篇文章正文内容，下面案例可供参考一、pandas是什么？示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。二、使用步骤1.引入库代码如下（示例）：import numpy as np import pandas as pd import matplotlib.
2022-04-11 15:23:25
52
原创 数据响应式
什么是响应式我打你一拳，你会喊疼，那你就是响应式的若一个物体能对外界的刺激做出反应，它就是响应式Vue的data是响应式const vm = new Vue（{data：{n:0}}）我如果修改vm.n那么UI中的n就会响应我Vue2通过Object.defineProperty来实现数据响应式响应式网页是啥？如果我改变窗口大小，网页内容会做出响应，那就是响应式网页比如https://www.smashingmagazine.com/但是你要注意，用户没事不会
2022-04-11 15:22:42
523
原创 options里面有什么
文档英文文档里面搜options，中文文档里搜选项即可得到所有相关文档options的五类属性数据：data、props、propsData、computed、methods、watchDOM：el、template、render、renderError生命周期钩子：beforeCreate、created、beforeMount、mounted、beforeUpdate、updated、activated、deactivated、beforeDestroy、destroyed、er
2022-04-11 10:12:28
866
原创 @vue/cli用法
1.全局安装：yarn global add@vue / cli2.创建目录：vue create 路径（路径可以用 .点3. 选择使用哪些配置（见下页）4.进入目录，运行yarn serve 开启webpack-dev-server5.用WebStorm或者VSCode打开项目开始CRM6.进入@vue / cli官网看看目录...
2022-03-08 00:00:00
117
原创 transform
四个常用功能位移translate缩放scale旋转rotate倾斜skew经验一般都需要配合transition过渡inline元素不支持transform，需要先变成blocktransform之translate常用写法translateX(<length-percentage>)translateY(<length-percentage>)translateX(<length-percentage>,<leng
2022-03-07 18:30:00
110
原创 用CSS画一个爱心
HTML代码<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>JS Bin</title></head><body> <div id="heart"> <div class="left"></div> <div class="right"></div&g
2022-03-07 14:26:00
143
原创 层叠上下文
比喻每个层叠上下文就是一个新的小世界（作用域）这个小世界里面的z-index跟外界无关处于同一个小世界的z-index才能比较哪些不正交的属性可以创建它MDN文档有写需要记忆的有z-index / flex / opacity / transform知道这些知识的面试官也不太多，不要花时间背忘了就搜【层叠上下文MDN】你说CSS为什么不单独创建一个属性做这个事负z-index与层叠上下文记住负z-index逃不出小世界的...
2022-03-07 13:45:00
50
原创 CSS动画
将div从左往右移动jsbin原理每过一段时间（用setlnterval做到）将div移动一小段距离直到移动到目标地点注意性能绿色表示重新绘制（repaint）了CSS渲染过程一次包含布局、绘制、合成其中布局和绘制有可能被省略前端高手不用left做动画用transform（变形）jsbin原理transform：translateX（0=>300px）直接修改会被合成，需要等一会修改transition过度属性可以自动脑部中间帧注意性
2022-03-07 11:01:52
35
原创 体系化学习
学一门语音必须学会声明语法（怎么写代码）如何调试（怎么知道自己代码写错了）在哪查资料（其实就是为了抄代码）网站推荐Google搜索关键时加MDNCSS tricks张鑫旭的博客标准制定者是谁如何学Copy-超文档、抄老师Run -放在自己的机器上运行成功Modify - 加入一点自己的想法，如何重新运行语法超级简单语法一:样式语法选择器{属性名：属性值；/*注释*/}注意事项所有符号都是英文符号，如果写错了，浏览器会警告屈服
2022-03-07 09:18:24
67
原创 新属性-position
positionstatic默认值，待在文档流里relative相对定位，升起来，但不脱离文档流absolute绝对定位，定位基准是祖先里的非staticfixed固定定位，定位基准是viewport（有诈）sticky粘贴定位，不好描述直接举例经验如果你写了absolute，一般都得补一个relative如果你写了absolute或fixed，一定要补top和leftsticky兼容性很差，主要用于面试装杯position：relative使用场景用于做位移
2022-03-06 23:22:37
85
原创 记住这些代码
display：flexflex-direction：row / Columnflex-wrap：wrapjust-content：center / space-betweenalign-items：center工作中基本只用这些flex item有哪些属性以下内容都是item的样式item上面加order（顺序）iiem上面加flex-grow（控制自己如何长胖）flex-shrink控制如何变瘦一般写flex-shrink：0防止变瘦，默认是1flex-b
2022-03-04 14:15:45
88
原创 float布局
步骤：子元素上加float：left和width在父元素上加 .clearfix(忘了加被我看到你就完了）经验有经验者会流一些空间或者最后一个没设width不需要做响应式，因为手机上面没有IE，而这个布局是专门为IE准备的IE6 / 7存在双倍 margin bug ，解决办法有两个意识将错再错，针对IE6 / 7把margin减半而是神来一笔，再加一个display：inline-block...
2022-03-04 13:55:39
89
原创 文档流的内容
流动方向inline元素从左到右，到达最右边才会换行block元素从上到下，每一个都另起一行inline-block也是从左到右宽度inline宽度为内部inline元素的和，不能用width指定block默认自动计算宽度，可用width指定inline-block结合前两者特点，可用width高度inline高度由line-height间接确定，跟height无关block高度由内部文档流元素决定，可用设heightinline-block跟block类似，可以
2022-03-03 15:15:00
39
原创 css布局分类以及布局的两种思路
两种固定宽度布局，一般宽度是960 / 1000 / 1024px(一般是pc端)不固定宽度布局，主要是靠文档流的原理来布局文档流本来就是自适应的，不需要加额外的样式第三种布局响应式布局意就是PC上固定宽度，手机上不固定宽度也就是一种混合布局布局的两种思路从大到小先定下大局然后完善每个部分的小布局从小到大先完成小布局然后组合成大布局两种均可新人推荐用第二种，因为小的简单老手一般用第一种，因为熟练有大局观...
2022-03-03 14:20:15
80
原创 用CSS写一个彩虹
html代码（如下）：<body><div class="rainbow"> <div> <div> <div> <div> <div> <div> <div> <div> ...
2022-03-03 13:53:57
443
原创 CSS两种盒模型
分别是content-box内容盒 - 内容就是盒子的边界border-box 边框盒 - 框架才是盒子的边界公式content-box width = 内容宽度border-box width = 内容宽度 + padding + border哪个好用border-box好用同时指定padding、width、border就知道为什么了margin合并哪些情况会合并父子 margin合并兄弟 margin合并如何阻止合并父子合并用 padding /
2022-03-03 13:37:13
31
原创 overflow溢出
当内容大于容器等内容的宽度或高度大于容器的，会溢出可以overflow来设置是否显示滚动条auto时灵活设置scrool时永远显示hidden时直接隐藏溢出部分visible时直接心事溢出部分overflow可以分为overflow-x和overflow-y脱离文档流block高度是用内部文档流元素决定，可以设height这句话的意思是不是说，有些元素可以不在文档流中哪些元素脱离文档流floatposition：absolute / fixed怎么让元
2022-03-03 11:02:57
1449
原创 css的层叠
层叠指什么？样式层叠可以多次对同一选择器进行样式声明选择器层叠可以用不同的选择器对同一个元素进行样式声明文件层叠可以用多个文件进行层叠这些特性是得CSS极度灵活这也为CSS后来被吐槽留下了隐患css使用最广泛的版本2.1caniuse.com检测浏览器是否支持...
2022-03-03 00:30:00
43
原创 用WiFi调试手机
步骤让手机和电脑处于同一WiFi手机可以直接用ip和端口访问电脑用哪个ip？ http-server给出的ip全部试一遍用border调试放调试CSS用vConsole.js调试JS
2022-03-03 00:00:00
138
原创 添加外部资源
添加图片注意不要图片变形如果图片比例不对，需要使用工具裁剪一下如果图片尺寸过大，无需特殊处理如果图片体积过打（300kb）,则需要压缩添加链接国内一般需要添加target= _blank添加完了之后要自己全部点一遍，防止出错...
2022-03-02 14:14:37
32
原创 from 的标签
作用发get 或 post请求，然后刷新页面属性action / autocomplete / method / target事件onsubmit
2022-03-02 14:11:22
57
原创 img标签的使用
作用发出get请求，展示一张图片属性alt / height / width / src事件onload / onerror响应式max-width :100%可替换元素考试可能会纹，被问的概率30%http-server . -c-1前端工程师的底线："永远不能让图片变形"...
2022-03-01 23:19:24
126
原创 table相关标签
相关的标签tabletheadtbodytfoottrtdth相关的样式table-layoutborder-collapseborder-spacing
2022-03-01 00:43:56
56
原创 a标签的内容
属性hreftargetdownloadrel=noopener作用跳转到外部页面跳转内部锚点跳转到邮箱或者电话等a的href的取值网址https://google.comhttp://google.com//google.com路径/a/b/c以及a/b/cindex.html以及./index.html伪协议JavaScript：代码；mailto：邮箱tel：手机号a的target的取值内置名字_blank
2022-03-01 00:14:31
91
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人