- 博客(68)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 ts 学习
interface propName 表示Key value 是任意类型; id是只读类型 一旦赋值后 无法修改interface Person { [propName: string]: any, readonly id:string}数组类型限定 第三者声明方式表示 只要下标是number 值就应该是number const arr : number[] = [1]; const arr :Array<number> = [1] interface .
2022-05-29 23:16:47
278
原创 照葫芦画瓢第2天 react
今天看下 Switch 开关组件 ，学习组件设计 以及一些知识react.PureComponent react15.3中 新增的组件 看名称可知 是纯组件意思 相比于 常用的react.Component 他能减少render 次数 自动的将更改后的state 和Props 与之前的做浅比较，如果是引用数据类型的话 是根本引用地址是否改变 来判断是否rendershouldComponentUpdate 原组件只要state props变化了 执行到 改声明周期函数默认都是返回true 在纯
2022-05-22 21:18:07
192
原创 照葫芦画瓢 第一天 react + mobx
一 点击icon 进行路由跳转 一些操作：首先用withRouter 包裹导出组件 A 实现 非router 也能跳转 props中会多 history, location, match三个参数调用公用的方法 传props进入 解析出 地址 这里replace 可以稍微深入学习下 第一个参数用了一个正则表达式去除路径上的后面多余的 / replace(//$/, () => ‘’) \ 作为转义符 第二个参数可以是一个函数 下面转述第二个参数 作为函数使用： 原理感觉像是匹配
2022-05-14 22:04:26
331
原创 vue中使用了better-scroll导致click事件失效
失效原因之一：使用了better-scroll，默认它会阻止touch事件，在配置中需要加上click: true即可
2020-08-28 20:45:56
345
原创 记录错误：To install it, you can run: npm install --save swiper/css/swiper.css
使用npm下载了：npm install vue-awesome-swiper --save，转到“ node_modules”文件夹，找到“ vue-awesome-swiper”，选择“ dist”，文档中没有要求的css文件一直报错找不到此文件。修改前：import 'swiper/dist/css/swiper.css'修改后：import 'vue-awesome-swiper/node_modules/swiper/dist/css/swiper.css'.
2020-08-20 20:11:27
13663
原创 vue项目中报“error Extra semicolon semi”错误的解决方法
错误原因：使用 vue-cli 构建的项目，模版是 webpack ，默认的 eslint 配置是以 standard 为基础的，要求是不使用分号。解决方法：在项目根目录下找到.eslintrc.js文件，为rules 属性新增配置：'semi': 0...
2020-08-10 20:29:49
1736
1
原创 webpack 安装babel 来解决JS高级语法
安装babel 失败！！！ 这个法子真可行简介babel首先要了解babel插件是干嘛的，随着js的语法规范发展，出现了越来越多的高级语法，但是使用webpack打包的时候，webpack并不能全部理解这些高级语法，需要我们使用一些插件来把高级语法，转为低级语法后打包。babel就是将高级语法转为低级语法的工具。安装插件：安装babel和相关loadercnpm install babel-core babel-loader babel-plugin-transform-runtime
2020-08-09 17:05:56
186
原创 亲测可行！npm install node-sass --save 安装失败解决办法
安装视频上教学这么来安装是 为啥我的安装不上？？因为npm安装插件是从国外服务器下载，受网络影响大，可能出现异常，如果npm的服务器在中国就好了，淘宝团队干了这事，中国的npm =>cnpm安装淘宝镜像：npm install -g cnpm --registry=https://registry.npm.taobao.org查看安装: nrm ls安装node-sass :cnpm install node-sass --save-dev亲测可行！！...
2020-08-08 22:00:57
1396
2
原创 2020/08/07 模块化 ，webpack基本使用
模块化：导入相关依赖包指令：npm install --save-dev @babel/core @babel/cli @babel/preset-env @babel/nodenpm i --save @babel/polyfill运行指令:创建babel.config.jsconstpresets=[["@babel/env",{targets:{...
2020-08-07 23:35:43
117
原创 2020/8/05 vue-router
一，基本使用步骤：注意点：路由规则数组是routes 挂载到Vue实列种是用router属性 component后面直接写组件对象 而不是写字符串形式的 用redirect重定向 刚进来的时候地址是根地址，跳转/login 来默认加载登陆组件<body> <div id="app"> <router-link to="/login">登陆</router-link> ...
2020-08-05 23:00:53
117
原创 说说功能强大又好使的ref与$refs
引入：你知道的vue是不提倡直接操作DOM的 那比如要DOM元素怎么办，绑定class属性，通过数据来控制class属性的变化是一种方法，那还可以用住粗ref来实现获取DOM元素 修改DOM元素样式 获取子组件数据或者使用子组件方法 子组件也能获取到父组件的数据 获取兄弟组件数据<body> <div id="app"> 父组件数据：{{msg}} <br> <input type="but
2020-08-05 09:18:55
315
原创 2020/08/04 fetch axios基础用法
fetch使用 text()是fetch特有的API 将他返回出现，再进行成功的回调才能拿到真正的数据data.text()返回的是一个promsie对象 需要return 出来再进行一次回调配置fetch参数fetch方法 get请求 默认就是getpost请求 请求头必须设置俩种常用的用法delete方式put方式axios 获取接口数据：...
2020-08-04 22:59:54
223
原创 2020/08/03 插槽
一，基本用法就是子组件提供一个坑，父组件想要填什么就通过<slot>往坑里填，插槽里面的内容会被覆盖 被父组件填了或者这样理解：插槽，也就是slot，是组件的一块HTML模板，这块模板显示不显示、以及怎样显示由父组件来决定<body> <div id="app"> <com>随便填入点东西</com> </div></body><script> var
2020-08-03 22:33:32
224
原创 2020/08/02 组件间的数据交互
一，子组件向父组件传值上篇说到，子组件直接通过props来拿到父组件的数据，再在数据上添加新数据，实现了子组件向父组件传值，但是这是不被推荐的vue组件间数据传递上篇也提到想用父组件的方法，可通过$emit()触发，还可以带参数，那不就可以通过参数来让父组件获取子组件的数据吗？...
2020-08-02 23:16:47
99
原创 2020/08/01 vue组件间数据传递
目录一，父组件给子组件传递数据二：子组件使用父组件的方法 通过$emit() 触发三，组件向父组件传递数据一，父组件给子组件传递数据我的理解是现在父组件中，找到需要数据的子组件 可以绑定固定数据,也可以是用v-bind绑定父组件可变的数据 如下 名字是give 数据是父组件的msg，有个坑命名最好用全部小写 将give 在子组件的props数组中定义下才能用，定义完了，才能在子组件中使用 父组件的数据msg一改对应的用到他数据的子组件也会改<body>...
2020-08-01 22:56:08
91
原创 2020/7/31 vue 复习
Vue动画看图可知 v-enter与v-leave-to样式可以写在一起 v-enter-to与v-leave样式可写在一起v-if比较懒，要是为false 都不会在代码中，为true就会创建出来，为false就会销毁掉v-show 是通过样式display:none来切换显示与隐藏的 频繁切换：v-show 很少切换v-if需要被动画控制的元素用<transition>标签包裹起来修改v-前缀如果标签定义了n...
2020-07-31 23:13:46
132
原创 2020/7/30 vue复习
vue:构建用户界面，只关注视图层Vue中一个核心的概念就是让元素不再操作DOM,解放用户双手，让程序员更多的去关心业务逻辑操作模板引擎带来的问题：比如有1000条记录进行升序排列，可能只有2条记录不是顺序的，这样就会导致渲染过多，浪费性能，所以框架就出来了，帮组我们减少数据操作，通过框架的指令，让程序员更多关注业务逻辑框架与库的区别： 框架：完整的解决方案，对项目侵入性比较大，项目需要更换框架，则需要重构整个项目 库（插件）：提供某个小功能，对对项目侵入性比较小，容易切换，影...
2020-07-30 23:00:23
188
原创 2020/7/29 移动端学习
移动端开发:1,移动端布局—适配2,touch3,库4,响应式**************************************************************viewport视口标签：其中width=device-width:页面宽等于设备宽度这句意思是 不允许放大缩小**************************************************************...
2020-07-29 23:14:36
114
原创 轮播图的无缝滚动其实不难
轮播图无缝滚动原理:利用css3中的transition 进行动画的过度 用css3中的transform :translateX() 进行平移 在图片最后放一张第一张的图片,到最后一张的时候,迅速的跳到第一张,然后继续滚动 注意跳回去的时候要将过度动画取消,再来移动 在最后一个图片过度事件完成后,跳回第一张 用到transitionend事件window.onload = function() { let focus = document.querySelector('.focu.
2020-07-28 23:59:23
1294
1
原创 2020/7/28 3D盒子 移动端拖拽
3D盒子<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head><style> .box
2020-07-28 23:35:39
174
原创 2020/7/27 HTML5 CSS3复习
HTML5 :1,gelolcation----定位2,video audio3,localStorage cookie :容量小到最多4k,浏览器服务器之间共享 localStorage: 5M 浏览器独享4,WebWorker 多进程5,WebSQL,IndexedDB 数据库用到前台 存在安全隐患,被删除6,文件操作 文件拖拽7,canvas 画图8,manifest 文件 前台控制缓存**************************...
2020-07-28 00:15:12
145
原创 2020/7/26 node HTML5
Node 断言引入模块 const assert=require(‘assert’);加入断言是个好习惯,用来检测参数,等是否合法, 一旦不满足条件就中断函数assert.equal(实际值,期望值,[错误信息]) 只能判断基本数据类型,引用类型不行,无法判断 是等价于== 不满足就抛出定义的错误信息assert.strictEqual(实际值,期望值,[错误信息]) 等价于 ===不满足就抛出定义的错误信息node fs模块con...
2020-07-27 00:31:50
123
原创 2020/7/25 async/await node基础
await等待promise返回的状态是resolve 然后继续执行下去,后面跟promise,generator,另外一个async函数等后面是普通表达式就正常执行 包括定时器async/await 基本用法:上面为啥data就是$.ajax()返回的 数据呢,因为$.ajax()里面的success:function(res){} 能本.then(res=>{})成功回调取代 value 就是res，而这个data 就是拿到了value 所以data 就是re...
2020-07-25 23:41:10
112
原创 2020/7/24 git ES6复习
git在使用的时候步骤 1,选择文件夹鼠标右键进入，Git Bash Here 2,git clone 仓库地址 HTTP和SSH(配置了密钥)都行 拉取远程仓库 3,将需要添加的文件放到被git 管理的文件夹 git add 文件名 4,git add a.js 之后 还要添加备注信息 git commit -m “添加备注” 5,git push 将文件提交到服务器，可能需要重新输入账号密码 6,拉取pull 用于更新代码 所以每天就是pu...
2020-07-24 23:44:50
87
原创 2020/7/23 Promise
为什么要用Promise?第一：相对于传统的纯回调函数时间上更灵活。 获取到了数据可以晚点再执行回调，3s获得了数据，但是5s之后再执行回调可以，而传统函数必须再启动异步任务前就指定好回调函数，一旦拿到结果就马上回调了第二：支持链式调用，支持解决回调函数地狱问题。回调地狱是回调函数的嵌套，上一个函数的结果作为下一个函数的条件链式调用时候就可以解决这个问题，并且只要写一个catch来进行最后的错误回调一个Promise对应一个异步任务回调地狱的终极解决方...
2020-07-23 22:31:35
112
原创 2020/7/22 Promise
Promise.then也是一个Promise,但是除了第一个then根据状态来回调的，Promise.then().then…都是执行成功回调newPromise((resolve,reject)=>{reject("失败")}).then(msg=>{console.log(msg);},error=>{console.log(error);//执行失败...
2020-07-22 22:52:18
115
原创 2020/7/21 axios与promise
目录PromiseaxiosPromisenew Promise((resolve,reject)=>{}) ES6中new一个Promise对象就处于pending’调用resolve() 就是属于成功状态调用reject() 就处于失败状态用then() 来处理回调函数 第一个参数是成功的回调，第二个参数是失败的回调newPromise((resolve,reject)=>{resolve('成功状态');...
2020-07-21 23:20:46
622
原创 2020/7/20 跨域获取数据，jsonp理解
目录跨域获取数据：动态创建script标签方式：跨域的函数封装：使用上述函数:jQuery中的跨域：JSONP理解：填坑：解决方法：跨域获取数据：跨域简单来说就是为了获取别人服务器数据，而同源策略下是无法实现的，但是src属性可以 常见的src后面跟着的网络图片地址，<iframe>标签里面的src 已经与跨域有关的动态创建script标签的src 都不受同源策略的限制，能获取到其他服务器数据动态创建script标签方式：window....
2020-07-20 11:32:15
122
原创 2020/7/19 熟悉原生ajax ，jQuery的ajax ，以及对ajax的封装
熟悉的最好的办法即使多敲几遍，再用记事本敲几遍ajax get // post 方式：window.onload=function(){ var username=document.getElementById('usename'); var email=document.getElementById('email'); var phone=document.getElementById('phone'); username.addEventListener('blur',functi..
2020-07-19 22:46:36
107
原创 2020/7/18 ajax复习
AJAX获取同源策略下的端口数据<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>注册界面</title></head><style>.
2020-07-18 22:58:37
108
原创 2020/7/17 轮播图插件
demo ：http://dsj-666.gitee.io/swiper源码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title&g..
2020-07-17 22:57:27
206
1
原创 2020/7/16 js练习之动态时钟
demo :http://dsj-666.gitee.io/clock源码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title>.
2020-07-16 18:54:37
81
原创 2020/7/15 js模拟画板
效果：https://gitee.com/dsj-666/Draw/pages源码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>js画布</title>
2020-07-15 21:28:22
165
1
原创 2020/7/14 js案列,jq 复习
js demo : https://dsj-666.gitee.io/css3loading/选择器<script>$(document).ready(function(){//***************基础选择器*****************alert($("p").length);//$("p")是签选择器获取方法，要在$(document).ready(function(...
2020-07-14 22:01:55
154
1
原创 2020/7/13 webpack学习
webpack概念： 前端的一个项目构建工具，他是基于Node.js 开发出来的前端工具，借助它可以完美的实现资源的合并，打包，压缩，混淆等功能wepack 安装：全局安装：npm install webpack -g步骤：npx webpack 经过webpack打包输出文件配置好了快捷指令就可以直接的运行快捷指令webpack --config webpack.config.js == npm run build配置服务器的开发依...
2020-07-13 21:50:49
96
原创 2020/7/12 js笔试题练习
var a = 100;function test() { a = 99; console.log(a); //99 console.log(this.a); //100 var a; console.log(a); //99}test(); (function() { var a = b = 3;})()console.log(b); //3console.log(a); //报错， a is not defined ...
2020-07-12 17:04:24
177
1
原创 2020/7/11 js复习笔记
2020/7/11严格模式下不被允许的 eval() 能执行字符串里面的东西，该能改变作用域vara=1;varm=eval("a+1");console.log(m);//2改变作用域：不被允许，是魔鬼XML: 与HTML基本一直，但区别 标签可以随便自己定义 这个数据格式被抛弃，用jsonDOM树 继承关系:Document 后面还有HTMLDocument 和XMLDocudment XML没写获取body head 直...
2020-07-12 00:21:00
101
原创 立即执行函数写法的原理
目录引言：为什么立即执行函数是这种格式的写法？推导：一：二：三 ：最后：引言：学过js的朋友们应该都知道立即执行函数，当只需要函数执行一次就行了，以后都不会执行，为了避免函数占用空间，就用立即执行函数，让他执行完一次后就自动销毁吧。为什么立即执行函数是这种格式的写法？下面是俩种写法，是不是都知道这么写，但是不知道为什么可以这么写，背就完事了？那还只停留在表面，不懂原理是没法做恶心的笔试题的，其实不一定只有俩种写法的，下面一步步的推导 ，看完你一定能明白,wc ..
2020-07-06 21:02:30
206
blue 37课时视频 +源码+笔记
2020-07-04
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人