- 博客(41)
- 收藏
- 关注
RSS订阅原创 冒泡排序
1、比较相邻的两个元素，如果前一个比后一个大，则交换位置。2、比较完第一轮的时候，最后一个元素是最大的元素。3、这时候最后一个元素是最大的，所以最后一个元素就不需要参与比较大小。以[23,9,78,6,45]为例，用冒泡排序法从小到大排列：function bubbleSort(){ var array = [23,9,78,6,45]; console.log("...
2020-02-08 23:27:10
194
原创 mysql-练习题
练习一：student,teacher,course,score#http://adminv2.happymmall.com/#--学生表 use mysqldata;drop table Student;drop table course;drop table teacher;drop table score;CREATE TABLE `Student`( `s_id` VA...
2020-01-05 21:50:54
285
原创 react--state/props/事件与数据绑定/可复用组件/Refs/Mixins
一.stateBodyIndex.jsimport React from 'react';export default class BodyIndex extends React.Component { constructor(){ super(); //调用基类的所有的初始化方法 this.state = { username : "Parry...
2019-12-16 15:48:24
168
原创 react入门--组件/JSX/生命周期
React 入门一.安装环境https://react.docschina.org/docs/create-a-new-react-app.htmlNode最好用最新版本cnpm install -g create-react-appcreate-react-app first-react-demonpm installnpm start查看历史版本https://facebo...
2019-12-12 15:46:57
304
原创 gitLab
1.git码云 相当于github 免费的服务器（国产）gitLab（开源服务器）2.登录 Your Projects第一步：安装git第二步：注册 基于gitLab（开源服务器） github（社区）http://www.orqt.com/users/sign_in第三步：配置git环境点个人图标==》setting1.本地环境打开命令行 ：配置登录用户和邮箱git co...
2019-11-03 20:44:24
214
原创 盒子模型
一.什么是盒子模型我们在刚开始接触CSS的时候总是被margin和padding闹的晕头转向，什么时候设置margin，什么时候设置padding，不是太清楚，设置了以后在界面上看到的效果也差不多呀。如何理解margin与padding呀，我们首先可以想象一下我们手里拿了一个钻戒要向女朋友求婚，一般求婚的时候钻戒都是在盒子里放着呢，我们要有盒子的概念，钻戒一般都放在盒子的中央，没有哪家的钻戒是...
2019-10-25 16:56:08
169
原创 js最简单左轮播
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style> *{ padding: 0; margin: 0;} li{ list-style: none; } #swiper...
2019-10-18 16:24:18
124
原创 ES6（异步操作和Async函数&&await）
async 是“异步”的简写，比如Ajax中就有这个代表异步请求；而 await 可以认为是 async wait 的简写，因为await只能出现在async函数中的语法规定。所以应该很好理解 async 用于申明一个 function 是异步的，而 await 用于等待一个异步方法执行完成。async 函数返回的是一个 Promise 对象。async 函数（包含函数语句、函数表达式、Lamb...
2019-10-15 16:49:19
304
原创 js基础复习
1.js基本数据类型有哪些,2.说说对js局部变量，全局变量，生存期，闭包的理解3.四大内置对象常见的方法和属性,数组说出8个，字符串说出5个，Math说出5个数组：去重（三种方法）,冒泡排序，每个字符出现的次数5.BOM：常见的方法和属性 window说出5个 history说出3个，location说出2个6.DOM：创建DOM，新增DOM，删除DOM，获取DOM，克隆DOM...
2019-10-15 15:12:55
724
原创 无限滚动加载
准备：json文件(模拟数据)html(有滚动条)<!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title&g...
2019-09-22 22:19:01
133
原创 template.js的使用
一.介绍1.作用template.js 一款javascript模板引擎，简单，好用。提供一套模板语法，用户可以写一个模板区块，每次根据传入的数据，生成对应数据产生的HTML片段，渲染不同的效果。2.特性：模版编译，渲染支持所有主流浏览器及Node（UMD）JavaScript原生语法丰富的自定义配置支持数据过滤异常捕获功能功能专一，简单好用二.基本使用1.页面中引入&...
2019-09-21 17:14:16
810
1
原创 react环境安装
1.node2.react安装及项目创建$ cnpm install -g create-react-app$ create-react-app my-app$ cd my-app$ npm start
2019-09-15 21:59:52
665
原创 typescript环境安装
1.安装node2.安装tscnpm install typescript -g// 查看安装是否成功 看见版本号代表成功tsc -v3.tsc简单命令// 编译tsctsc 文件名// 编译tsc 到指定目录tsc --outDir 指定目录文件名 入口文件名eg: tsc --outFile js/file.js file.ts...
2019-09-15 21:35:21
104
原创 DOM&&BOM
BOMBOM: Browser Object Model 浏览器对象模型Browser：浏览器以车为例子简单解释什么是BOM?BOM是js的组成之一，他提供了独立与【内容与浏览器窗口】进行交互的对象，使用浏览器对象模型可以实现与HTML的交互。【BOM 提供了很多对象，用于访问浏览器的功能，这些功能与任何网页内容无关。 】2. BOM核心 【window对象【重重点】】BOM ...
2019-08-22 22:56:16
103
原创 css3基础
一.css3边框1.border-radius 用于创建圆角四个值左上角，右上角，右下角，左下角三个值左上角, 右上角和左下角，右下角两个值左上角与右下角，右上角与左下角一个值四个圆角值相同2.border-image 使用图片创建边框–兼容性不好，慎用border-image-source 边框图片的路径border-image-slice 图片边框向内偏移bord...
2019-07-28 23:20:21
126
原创 vue中keep-alive的使用
keep-alivekeep-alive是Vue提供的一个抽象组件，用来对组件进行缓存，从而节省性能，由于是一个抽象组件，所以在v页面渲染完毕后不会被渲染成一个DOM元素<keep-alive> <loading></loading></keep-laive>当组件在keep-alive内被切换时组件的activated、deact...
2019-07-26 00:23:51
138
原创 webpack搭建项目
基础篇1.新建一个文件，在当前目录下执行npm init然后一直回车：可以发现，当前目录下多了一个 package.json 的文件，文件里面自动生成以下代码：{ "name": "demo", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "...
2019-07-25 00:24:29
131
原创 css浮动讲解
标准文档流：宏观地讲，我们的web页面和photoshop等设计软件有本质的区别：web页面的制作，是个“流”，必须从上而下，像“织毛衣”。而设计软件，想往哪里画个东西，都能画。标准文档流特性1.空白折叠现象：无论多少个空格、换行、tab，都会折叠为一个空格。比如，如果我们想让img标签之间没有空隙，必须紧密连接：<img src="images/0.jpg" /><...
2019-07-21 21:45:35
175
原创 给网页穿上美丽的外衣
目标掌握CSS的语法结构和在网页中的应用掌握CSS的文本和字体样式掌握CSS背景样式一.了解css定义：CSS层叠样式表（Cascading Style Sheet）优势：内容与表现分离网页的表现统一，容易修改丰富的样式，使页面布局更加灵活减少网页的代码量，增加网页的浏览速度，节省网络带宽运用独立于页面的CSS，有利于网页被搜索引擎收录二.语法规则例，选择器 {声...
2019-07-14 23:20:40
263
原创 走进html
目标：了解html掌握html结构标签的应用掌握html内容标签的应用掌握超链接的应用一.走进html（了解）1.定义HTML：超文本标记语言（Hyper Text Markup Language）HTML不是一种编程语言，而是一种标记语言，描述网页的语言HTML使用标签描述网页中图片、文本、音乐、视频、超链接等注意：查看任意网页源代码2.地位前端三大结构：结构层，表现层，...
2019-07-14 23:06:37
122
原创 es6-对象拓展
1.对象简洁表示法 let name="zhangsan" let sex = "男" let obj = { name, sex, show(){ console.log(this.name); } } obj.show();2.属性名或方法名为变量时的写法 let attr='name'; ...
2019-07-12 11:28:46
154
原创 js中的存取器及双向数据绑定的实现
当使用存取器描述属性的特性的时候，允许设置get和set属性： var obj = {}; Object.defineProperty(obj,"newKey",{ get:function (){} | undefined, set:function (value){} | undefined });es5写法： var obj = {}; var...
2019-07-12 10:59:37
176
原创 vue-router的两种模式
Vue-router 中有hash模式和history模式，vue的路由默认是hash模式，一般开发的单页应用的URL都会带有#号的hash模式，因为整个应用本身而言就只有一个HTML，其他的都是通过router来渲染。简单介绍下两种模式：hash —— 即地址栏 URL 中的 # 符号（此 hash 不是密码学里的散列运算）。比如这个 URL：http://www.abc.com/#/hell...
2019-07-12 09:25:14
503
原创 es6-数组拓展
//1.Array.of方法用于将一组值，转换为数组。 { let arr = Array.of(3,4,7,9,11); console.log('arr=',arr); let empty=Array.of(); console.log('empty',empty);}//2.Array.from方法用于将两类对象转为真正的数组{ let p=document...
2019-07-11 11:33:47
208
原创 es6-解构
es6中的解构有数组解构和对象解构一.数组解构1.基本用法以前为变量赋值，只能直接指定值。let a = 1;let b = 2;let c = 3;ES6 允许写成下面这样。let [a, b, c] = [1, 2, 3];//a=1,b=2,c=3本质上，这种写法属于“模式匹配”，只要等号两边的模式相同，左边的变量就会被赋予对应的值。也可使用嵌套2.嵌套写法let ...
2019-07-11 10:36:38
225
原创 vuex实现购物车
数据：index.jsimport Vue from "vue";import Vuex from 'vuex';Vue.use(Vuex);const state = { shop_list: [{ id: 11, name: '鱼香肉丝', price: 12, }, { id: 22, name: '宫保鸡丁', price:...
2019-07-08 23:11:39
401
原创 vuex的简单使用
第一步：安装npm install vuex --save-dev第二步：引用全局引入：main.jsimport data from "./store/data";new Vue({ el: '#app', router, store:data, components: { App }, template: '<App/>'})第三步：写共享数据...
2019-07-08 17:18:38
123
原创 axios-post请求
第一步：安装：npm install qs --save-dev第二步：import axios from "axios";import qs from "qs";export const getData = (params)=>{ return axios .post("/api/getImages",qs.stringify(params)) .then((res)=&...
2019-07-08 14:51:09
298
原创 http协议
1.什么是http协议？对浏览器客户端 和 服务器端 之间数据传输的格式规范tcp/ip协议？浏览器客户端 和 服务器端 之间数据传输是否成功http协议内容请求行请求头：Accept: text/html,image/* -- 浏览器接受的数据类型Accept-Charset: ISO-8859-1 -- 浏览器接受的编码格式Accept-Encodi...
2019-07-07 09:39:31
99
原创 tooken详解
使用思路1.用户发出登录请求，带着用户名和密码到服务器经行验证，服务器验证成功就在后台生成一个token返回给客户端2.客户端将token存储到cookie中，服务端将token存储到redis中，可以设置存储token的有效期。3.后续客户端的每次请求资源都必须携带token，这里放在请求头中，服务端接收到请求首先校验是否携带token，以及token是否和redis中的匹配，若不存在或不...
2019-07-07 00:16:40
2469
原创 axios,拦截器,封装
第一步：在confing/index.js中配置proxyTable: { '/api': { //使用"/api"来代替apiconfig target: 'http://baidu.com', //请求原地址 changeOrigin: true, //允许跨域 pathRewrite: { '^/api': '' //路径重写 ...
2019-07-06 23:37:30
409
原创 使用promise封装axios
import axios from 'axios';import router from '../router';axios.defaults.timeout = 100000;/*const apiUrl = 'http://shopping.zhongguotengcha.com';*/const apiUrl = 'http://vinetea.weibeicc.com';a...
2019-07-05 17:47:28
302
原创 promise讲解
一.promise的出现在javascript中，所有的请求都是单线程的，导致JavaScript的所有网络操作，浏览器事件，都必须是异步执行。异步执行可以用回调函数实现：function callback() { console.log('Done');}console.log('before setTimeout()');setTimeout(callback, 1000);...
2019-07-05 17:08:36
196
原创 vue中字符串拼接路由path路径
功能：产品列表页面进入产品详情页面,产品详情中四个模块之间切换products.vue进入detail.vue页面,detail.vue中配置子路由第一步：products.vue<ul class="pro"> <router-link to="/detail/pro1" tag="li">产品1</router-link> <route...
2019-07-05 14:39:14
7181
原创 在vue-cli中使用axios
第一步：安装npm install axios ---save-dev第二步：在需要请求数据的文件中引入import axios from "axios"; export default{ name:"news", created(){ axios .get('../../static/db.json') .then((res)=>{ conso...
2019-07-05 10:23:58
324
原创 vue-cli路由传参的三种基本方式
现有如下场景，点击父组件的li元素跳转到子组件中，并携带参数，便于子组件获取数据。<li v-for="article in articles" @click="getDescribe(article.id)">方案一：getDescribe(id) {// 直接调用$router.push 实现携带参数的跳转 this.$router.push({ ...
2019-07-04 15:52:34
1855
原创 在vue-cli中使用mint-ui
前言：基于vue,适合写app第一步：安装npm install mint-ui -S第二步：main.js中配置import Mint from 'mint-ui';import 'mint-ui/lib/style.css'Vue.use(Mint);第三步：在组件中按官网（https://mint-ui.github.io/docs）指导，需引入，如Message box...
2019-07-01 17:28:51
385
原创 在vue-cli项目中使用使用iview
介绍：iView 是一套基于 Vue.js 的开源 UI 组件库，主要服务于 PC 界面的中后台产品。第一步：安装npm install iview --save第二步:main.js中引入import iView from 'iview';import 'iview/dist/styles/iview.css';Vue.use(iView);第三步：测试<templa...
2019-07-01 17:13:45
505
2
原创 在vue-cli项目中使用使用swiper
第一步：切换进项目 安装swipernpm install swiper --save-dev第二步：创建组件 swiper.vue导入import Swiper from "swiper";@import 'swiper/dist/css/swiper.css';完整swiper.vue组件<template> <div> <div cla...
2019-07-01 16:59:32
1987
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人