大前端
保存平时关于web前端的react,react-native,vue等框架
以及node与原生js以及最新的es6语法
一腔&孤勇
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
javaScript高级程序设计读书笔记 第二章-HTML中的JavaScript
script的常见属性属性名作用ansync异步加载脚本(不阻塞页面导致白屏),执行顺序不确定,先加载完的先执行defer异步加载脚本(不阻塞页面导致白屏),按照引入的顺序执行src引入的外部js的地址,不受跨域影响(JsonP的原理)type脚本语言的类型,大多数情况下为text/javascript,如果值为module,会被识别为es6模块,能出现import与export等关键字script执行顺序正常情况下(行内script或者外部引入但是原创 2020-10-11 11:46:02 · 257 阅读 · 0 评论 -
vue踩坑笔记 十二.vue中引入vuex
文章目录安装依赖引入vuex样例代码安装依赖npm i vuex -s引入vuex在src目录下新建一个store目录,分别创建以下文件项目比较简单,建一个state文件,一个mutations文件就行,如果项目规模大还可以按需创建getters文件,actions文件等mutations.jsexport default { changeCity (state, val) ...原创 2020-01-19 10:58:31 · 813 阅读 · 0 评论 -
vue踩坑笔记 十一.vue中引入滑块组件
文章目录效果图安装依赖常见用法完整代码效果图安装依赖npm install better-scroll -S常见用法BetterScroll 最常见的应用场景是列表滚动,我们来看一下它的 html 结构。<div class="wrapper"> <ul class="content"> <li>...</li> ...原创 2020-01-18 13:37:25 · 527 阅读 · 0 评论 -
vue踩坑笔记 十.使用vue进行数据mock
文章目录安装依赖建立mock文件mock样例代码全局引用mock在组件中使用常见用法安装依赖npm install --save-dev mockjsnpm install --save axios建立mock文件src目录下创建mock文件夹,创建index.js文件mock样例代码import Mock from 'mockjs' const data={ "i...原创 2020-01-17 20:31:46 · 431 阅读 · 0 评论 -
vue踩坑笔记 九.移动端vue坑
移动端vue页面禁止移动/滚动当需要在移动端中禁止页面滚动,加入:@touchmove.prevent即可,代码如下<template> <div @touchmove.prevent> <h3 class="main-bk">{{ title }}</h3> <p>您好!{{provider}}:</p&...原创 2020-01-17 20:05:57 · 648 阅读 · 0 评论 -
vue踩坑笔记 八.新建一个移动端vue项目的准备工作
文章目录搭建git环境创建vue项目引入第三方样式文件引入第三方js文件提交项目在github上查看该项目搭建git环境1.运行git init命令生成一个git环境2.去githuab上新建一个项目3.运行 git clone命令,将github上的代码克隆下来4.将github上的项目的ssh密钥链接复制下来运行下面命令将本地仓库与远程仓库建立连接git remote ad...原创 2020-01-16 10:58:04 · 248 阅读 · 0 评论 -
vue踩坑笔记 七.使用ip地址访问本机运行的vue项目
文章目录一.确保本机tomocat 或者apache运行正常二.获取本机ip地址进入dos界面获取本机ip地址三.输入ip地址加端口号四.运行错误或拒绝访问(很关键)五.重启项目一.确保本机tomocat 或者apache运行正常在浏览器使用localhost或者127.0.0.1访问相关资源,保证web网络服务器正常二.获取本机ip地址进入dos界面win+R输入cmd获取本机i...原创 2019-11-30 12:10:17 · 664 阅读 · 0 评论 -
js笔记 四.函数防抖与节流
文章目录引言问题一(防抖)需求描述实现代码代码解析问题二(节流)需求描述实现代码代码解析引言在日常开发中会经常使用到延时任务但是api提供的setTimeout与setInterval仅仅只能满足基本需求所以我们需要在此基础上进行二次开发来解决一些复杂的问题问题一(防抖)需求描述实现搜索功能,当用户在文本框中输入数据后,根据用户输入的关键词进行搜索,但是为了用户体验的良好以及减轻服...原创 2019-11-04 13:51:53 · 146 阅读 · 0 评论 -
es6 入坑笔记(一)---let,const,解构,字符串模板
let 全面取代var大概相似于C++的定义,一个变量必须得先定义后使用,没有预编译注意let的作用域,一个{}就是一个作用域,上述规则须在一个作用于内坑:for(let i =0;i < 10; i++){ let i=20; }这个例子存在父子作用域,即(){}各为一个作用域,所以i可以重复letconst即静态变量值不允许改变,常用于声明为一...原创 2018-11-07 23:20:21 · 180 阅读 · 0 评论 -
es6 入坑笔记(三)---数组,对象扩展
数组扩展循环arr.foreach(){//回调函数function(val,index,arr){//val:当前读取到的数组的值,index:当前读取道德数组的索引,arr:当前的数组名}} 映射arr.map同foreach,但是map每读取一条信息都会有一个返回值,从而可以整理数据结构let newArr=arr.map(){//回调函数...原创 2018-11-07 23:21:41 · 171 阅读 · 0 评论 -
es6 入坑笔记(二)---函数扩展,箭头函数,扩展运算符...
函数扩展1.函数可以有默认值 function demo( a = 10,b ){}2.函数可以使用解构 function demo( { a = 0,b = 0 } = {} ){}3.函数参数最后可以多一个逗号function demo(a,b,c,){}坑:1.与for等父子域不同function(a){ let a=10;}会报错,因为...原创 2018-11-07 23:21:00 · 140 阅读 · 0 评论 -
es6 入坑笔记(四)---异步处理
promise用于js的异步处理形式:1.申明一个promise的对象let p = new Promise(function(成功时的参数,失败时的参数){ if(。。。。){ 成功时的参数(成功时想传的值); }else{ 失败时的参数(失败时想传的值); }});调用then方法p.then(//第一个为成功时调用的回调函数(成功时想...原创 2018-11-07 23:22:57 · 163 阅读 · 0 评论 -
es6 入坑笔记(五)
Symbol主要用做key或私有变量,Symbol是唯一的不可重复的,也是一个单独的数据类型定义形式:let demo=Symbol("aaaa");1.Symbol不能使用new定义2.如果当作对象的key则该对象使用for in 循环时不能遍历出来 ...原创 2018-11-08 11:28:32 · 153 阅读 · 0 评论 -
react入门笔记一(react工程的创立)
1.建立一个普通的h5界面,然后像引入jquery一样去引用react相关的js文件2. 需要引入browser的js包,这个包的作用是将jsx的语法转为js,关于jsx后面的博文再详细说明,但是我们在react的开发中使用的都不是js语法而是jsx,所以需要这个包来解析jsx3.在h5代码后创建一个script的标签,以后我们项目开发的js代码基本放在这,但是要注意一点,需要设置...原创 2018-11-08 11:28:02 · 190 阅读 · 0 评论 -
react入门笔记二(组件的定义)
1.为什么要使用组件化组件化可以说是react的核心思想了,使用组件以后可以极大的降低耦合度,减少很多的冗余代码的编写,使用组件,就是将我们界面中重复出现多次的视图提取出来,进行封装,在我们后来的调用中碰到这样已经封装好的视图就可以直接调用了,到时候写界面就像完乐高积木一样,轻松愉快了,需要什么组件,一行代码就可以直接调用了2.组件化需要注意的坑 2.1.react中创建的组件...原创 2018-11-08 14:46:29 · 107 阅读 · 0 评论 -
react入门笔记四 (组件嵌套)
经过前面的那些学习,我们现在已经了解了组件化的思想,现在让我们来开始组件化的开发吧例如我们现在实现这样一个页面1.有一个p标签,表示跳转到的网站名2.有一个a标签可以跳转3.用一个div将上面的两个组件容纳进去这个很简单实现,一个父div,里面装一个p,一个a标签就完事了,但是如果我们的页面中有很多这样的div,我们还需要写这么多代码嘛,不,使用组件化的思想,我们可以将...原创 2018-11-09 09:33:35 · 181 阅读 · 0 评论 -
react入门笔记三(组件的样式)
1.设置组件的样式的类型样式定义的类型有三钟方式:内联式对象样式选择器样式 2.使用内联的方式去定义组件的样式react使用内联样式定义时与h5的不同样例3.使用对象的样式去定义组件样式先定义样式的对象去模板内使用4.使用选择器的样式去定义组件样式需要注意的是我们在定义的时候不能像h5一样,直接使用class而要使用classNa...原创 2018-11-08 15:04:43 · 171 阅读 · 0 评论 -
css笔记 一.css基本知识
文章目录css的继承选择器css权重值(优先级):元素类型伪元素:使父元素包裹浮动元素元素定位margin塌陷margin合并css常用知识点css的继承1.子父派生div p{…}这样div下面的子孙元素p都会继承该属性2.直接派生div > p{…}这样只有作为div的儿子的p才能继承相关属性,孙子等子孙则不行3.浏览器寻找派生节点顺序浏览器寻找节点的顺序是从...原创 2019-09-03 20:01:09 · 173 阅读 · 0 评论 -
css笔记 四.flex布局
文章目录说明设置在子元素上的属性1.flex-grow:number (放大)2.flex-shrink:number(缩小)3.flex-basis(基准值,权重比width,height等要高)4.flex(简写方式)5.order:number(排序)6.align-self(对齐方式)设置在父元素上的属性1.flex-direction(元素排列方式)2.flex-wrap(换行)3.fl...原创 2019-09-15 10:43:05 · 503 阅读 · 0 评论 -
css笔记 二.css3中的动画效果
文章目录animation动画帧执行动画控制动画播放状态transform旋转(单位:deg)放缩(单位:无)扭曲(单位:deg)移动(单位:px)确定变换的中心点案例transition动画案例animation动画帧形式@keyframes 帧名{ /*任意填写每个帧的各个节点(按百分比分)的状态*/ 0%{/*code*/} 33.3%{/*code*/...原创 2019-09-10 19:36:02 · 434 阅读 · 0 评论 -
css笔记 十.css常见写法
文章目录水平居中网络差加载不出图片时,仍能展示基本页面单行文本垂直,水平居中画七巧板画三角形单行文本过长显示...导航栏画五环水平居中 <div class="wrape"> <div class="content"></div> </div> .wrape{ height: 30px; background:...原创 2019-09-03 20:24:49 · 210 阅读 · 0 评论 -
css笔记 三.css3选择器
文章目录属性选择器empty空节点选择器target选择器子元素伪类选择器enable disable 可用选择器属性选择器[属性名 = “属性值”] (完全等于)eg: li[class = "a"] 选择class为完全等于a的li节点 <li class="a">222</li> <li class="b a">...原创 2019-09-10 09:43:30 · 219 阅读 · 0 评论