- 博客(39)
- 收藏
- 关注
原创 前端鉴权如何做
登录接鉴权用户名密码=>客户端=>/login=>服务端=>比对数据库=>数据库返回数据=>服务端=>返回数据=>给客户端鉴权基础鉴权,session/cookie,JWT,Oauth算法加密Base64,MD5/SHA-1,DES/AES ,RSA/ECCHTTPSSSL,HTTP劫持,数据篡改,敏感信息,中间人常见的鉴权方式SessionCookie 优点:较易扩展简单缺点:安全性低,性能低,服务端存储,多服务器同步sessi
2021-11-15 22:14:26
854
原创 Vue的基础知识
1,通过v-on:click绑定事件2,可以通过<li v-for="(item,index)of list"> </li>3,在一个标签上 某一个属性跟某一个数据绑定的话 只能使用 v-bind:title="inputvalue"4,组件如何接受传递过来的值:在组件上使用 v-bind:index 绑定想要传的值然后在组件内部通过app. component( 'todo-item',{props: ['content', 'index' ],template:
2021-11-15 22:04:51
719
原创 小程序 api的封装
//es6的js文件的导出导入 const config = { appkey: 'your appkey', apiBaseUrl: 'http: /lse.7yue.pro/' } export { config } // 微信原生api请求接口的方法 onLoad: function (options) { wx.request({ url: `${confi.
2021-11-11 00:48:47
217
原创 列表页面的编写4
```bash/** @Author: Rosen* @Date: 2018-01-31 13:10:47* @Last Modified by: Rosen* @Last Modified time: 2018-02-01 16:30:04*/import React from 'react';import { Link } from 'react-router-dom';import MUtil from 'util/mm.jsx'imp.
2021-10-24 23:29:24
101
原创 新增页面的编写
/** @Author: Rosen* @Date: 2018-02-01 16:19:36* @Last Modified by: Rosen* @Last Modified time: 2018-02-04 21:39:59*/import React from 'react';import MUtil from 'util/mm.jsx'import Product from 'service
2021-10-24 23:28:09
1371
原创 react hooks的用法
一,页面初始化的结构export const SearchPanel=()=>{二、声明字段的类型,请求字段类型const【param,setParam】=useState({name:'',personId:''})四、写请求接口的代码useEffect(()=>{fetch('').then(async response=>{setList(await response.json())})},【param】)三、下面写页面的页面结构与样式return 五、
2021-10-17 22:22:22
85
原创 数组常用的方法
穷举法是什么穷举法,顾名思义,是指根据题目的条件确定答案的大致范围,并在此范围内对所有可能的情况逐一验证,直到全部情况验证完毕。若某个情况符合题目的条件,则为本问题的一个解;若全部情况验证后都不符合题目的条件,则本题无解。什么是数组数组(Array) ,顾名思义,用来存储一组相关的值,从而方便进行求和、计算平均数、逐项遍历等操作。var scoreArr = [96,97,76,87,87,90,91,100,78,56]每种高级编程语言中都有数组,它是非常重要的一种数据结构数组的定义方法1
2021-08-29 21:20:13
94
原创 小程序视图层的知识
<view wx:for="{{users}}" wx:key="*this">{{item.name}}</view> key值可以使用*this来表示怎么做小程序视图层代码的拆分首先使用template声明一个模板<template name="content-template"> <view>{{content}}</view> <view>hello world</view></templat
2021-08-18 23:53:21
72
原创 小程序逻辑层的API
1,微信开发者中wx提供了许多逻辑层调用的api调用接口的方法Page({onShow(){ wx.request({ url: 'https://www.fastmock.site/mock/e2295b89cf0d602bd83336577ca17dd1/shop/api/username', success(res){ console.log(res) } }) }})...
2021-08-18 23:19:42
122
原创 小程序基本知识点
Page({//data定义内容data:{ name:'ball'},changename(){//更新data里面的数据 this.setData({ name:'name' })}})<!--index.wxml--><!-- bindtap绑定事件 --><view class="container" bindtap="changename">{{name}}</view>...
2021-08-18 23:07:17
54
原创 小程序页面级别的生命周期函数
Page({// 在页面运行的某个时刻会自动执行的函数 // 是页面被加载到内存里的时候,或者说页面第一次启动的时候 onLoad() { console.log('onLoad') }, // 是页面被加载到内存里的时候,或者说页面第一次启动的时候 // 并且,页面被渲染完成之后自动执行 onReady() { console.log('onReady') }, // 页面每次被展示的时候自动执行 onShow() { console.log(
2021-08-18 22:58:34
125
原创 如何获取小程序全局里面的app.js的方法
app.js的内容// app.jsApp({ // 生命周期函数指的是在某一时刻会自动执行的函数 // 在小程序启动的时候,自动执行的函数 onLaunch(options) { console.log('onLaunch', options) }, // 在小程序重新展示的时候,自动执行的函数 onShow(options) { console.log('onShow', options) }, // 在小程序取消展示的时候,自动执行的函数 on
2021-08-18 22:49:20
1083
原创 ES6新增方法和属性以及ajax笔记
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc
2021-08-15 23:55:28
137
原创 let和const 和var 的区别
// 1.let和const是什么//声明变量或声明常量l/ var声明变量// let 代替var,声明变量// const声明常量constant// 2.let和const的用法// var一样// var username = ‘Alex’;// let age = 18;// const sex = ‘male’;// console.log(username, age, sex);//3.什么是变量,什么是常量//username = ‘zS’;// age = 28;/
2021-08-15 13:58:15
95
原创 JS基础知识
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc
2021-08-10 00:10:46
176
原创 函数常用的知识点
script>//定义的函数是不会直接执行的// function name() {// console.log(“您好”)// console.log(“您好”)// console.log(“您好”)//// }//函数调用了才会执行 会执行三次// name();// name();// name();//语句执行顺序*// function fun () {// console.log(“A”)// console.log(“B”)// console.log
2021-08-09 22:51:05
73
原创 对象的知识点补充
// 认识对象 // 对象(object)是“键值对”的集合,表示属性和值的映射关系 // JS中,大括号表示对象 // var xiaoming = { // 属性名(键名,key)name: '小明', // age: 12, // sex:'男', // hobbies: ['足球','编程]};// 对象的语法 // k和v之间用冒号分隔, // 每组k : v之间用逗号分隔,最后一个k :v对后可以不书写逗号 // var
2021-08-08 22:14:57
103
原创 前端对象的知识点
// 认识对象 // 对象(object)是“键值对”的集合,表示属性和值的映射关系 // JS中,大括号表示对象 // var xiaoming = { // 属性名(键名,key)name: '小明', // age: 12, // sex:'男', // hobbies: ['足球','编程]};// 对象的语法 // k和v之间用冒号分隔, // 每组k : v之间用逗号分隔,最后一个k :v对后可以不书写逗号 // var
2021-08-08 19:56:55
213
原创 BOM的常用知识点
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc
2021-08-08 16:19:32
80
原创 常用的DOM知识点
/ 节点的nodeType属性可以显示这个节点具体的类型。 // nodeType值 // 节点类型 // 1,元素节点,例如<p>和<div> // 3,文字节点 // 8,注释节点 // 9,document节点 // 10,DTD节点// 访问元素节点的常用方法 // document.getElementById() 通过id得到元素 IE6 // doc
2021-08-08 14:00:33
110
原创 关于函数的定义与使用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc
2021-08-08 09:47:31
80
原创 javascrpit流程控制语句
计算机的流程控制语句:顺序执行、选择语句(if)、循环语句(for)优秀的算法的要求 正确性 健壮性 可读性switch语句除if语句之外,JS还提供了另外一种选择语句:Switch语句。switch语句的用途:当一个变量被分类讨论的情形。在switch()的圆括号中一般是一个变量名,这个变量将被分类讨论。case表示“情况”,它后面没有圆括号,直接跟一个值。程序会依次将case后面的值与switch圆括号中的值进行全等比对,如果比对相同,则执行这条case冒号后面的语句。default表示默认
2021-08-02 21:55:42
81
原创 Theme层代码实现
Theme层代码实现只要全局加上一个属性选择器,就搞定了~~~做成属性选择器html的代码<div data-theme="default">css的代码[data-theme= 'default' ] .box {background:pink;}[data-theme= "cool'] .box{background: blue;}[data-theme= 'warm'] .box{background: yellow;}如何对全局页面产生影响 提升到全局1,将da
2021-07-18 19:03:46
506
原创 Acss层代码实现
让样式极限复用解决Acss无语义化缺点:属性选择器Settings 与Acss层的关系 ACSS .f1 {float: left;}.fr{float: right;}a.page<div class="fl fr fz30 m-1-8"></div><div class="fl"></div><div class="fl"></div><div class="fl"></div>
2021-07-18 18:44:05
120
原创 components层代码实现
ooCSS -》BEM(进阶版OOCSS):经典的组件:栅格、布局组件自定义组件ooCSS 就只需要拓展一个新的对象 拓展一个类名 例如 <div clas=header fixed></div>//传统的写法<template><div class="media"><div class="img"></div><div class="content"></div></d
2021-07-18 17:47:31
164
原创 base层的代码实现
Base层代码实现Generic层:引入normalize.css,重置浏览器默认样式Base层:对各类元素基础样式进行补充使用https://github.com/necolas/normalize.css 重置浏览器的默认样式然后在npm install --save normalize.css在main.js中导入import 'normalize.css/normalize.css'在每个vue.config.js里面文件配置就相当于在每个vue的文件以及
2021-07-18 17:45:44
200
原创 关于tool层的导入,以及全局的变量限制
首先导入git:https://github.com/W3cplus/SassMagic该的src目录下文件然后新建vue.config.js// vue.config.jsmodule.exports = {css: { loaderOptions: { scss: { prependData: `@import "@/style/tools/_sassMagic.scss";` }, }}}再然后通过@include box-cente
2021-07-18 17:44:41
102
原创 关于scss的写法以及setting公共变量的提取
Settings层代码实现SASS的介绍定义一些公共变量公共变量:颜色、边框、字体大小、阴影、层级..变量的写法$col:#666;.text1 {color: $col;}.text2 {color: $col;}.text3 {color:$col;}//嵌套写法main {color:#00ff00;.redbox {background-color: #ff0000;}}#main {color: #00ff
2021-07-18 17:44:11
546
原创 css的设计模式
<!--容器与内容分离--><!-- post中的meta-data --><div class="post"><p class="metadata"><a>Author name</a>commented on<a>21-02-2010</a>@</p></div><!-- comment中的meta-data --><div class..
2021-07-18 17:43:18
44
原创 创建axios 请求服务的整个过程代码
创建axios 请求服务的整个过程代码import axios from 'axios';import { response } from 'express';const service=axios.create({});service.interceptors.request.use( config=>{ return config })service.interceptors.response.use( response=
2021-07-18 17:42:46
106
原创 前端面试官怎么问的问题都是原理呢?
HTML1.必考:你是如何理解 HTML 语义化的?i.举例法HTML 语义化就是使用正确的标签(总结)段落就写 p 标签,标题就写 h1 标签,文章就写article标签,视频就写video标签,等等。ii.阐述法首先讲以前的后台开发人员使用table布局,然后讲美工人员使用div+css布局,最后讲专业的前端会使用正确的标签进行页面开发。2.meta viewport 是做什么用的,怎么写?举例法然后逐个解释每个单词的意思。3.你用过哪些 HTML 5 标签?举例法平时如果只用d
2021-03-23 23:41:05
455
1
原创 面试题
闭包闭包的定义其实很简单:函数 A 内部有⼀个函数 B ,函数 B 可以访问到 函数 A 中的变量,那么函数 B 就是闭包闭包存在的意义就是让我们可以间接访问函数内部的变量第⼀种是使⽤闭包的⽅式第⼆种就是使⽤ setTimeout 的第三个参数,这个参数会被当成 timer 函数的参数传⼊第三种就是使⽤ let 定义 i 了来解决问题了,这个也是最为推荐的⽅式Jsonp解释jsonp 的原理,为何它不是真正的ajax ?浏览器的同源策略(服务端没有同源策略)和跨域img scrpit 能够
2021-03-23 23:27:31
82
原创 react50道面试题
React 面试题以下是面试官最有可能问到的 50 个 React 面试题和答案。为方便你学习,我对它们进行了分类:基本知识React 组件React ReduxReact 路由基本知识1. 区分Real DOM和Virtual DOMReal DOMVirtual DOM1. 更新缓慢。1. 更新更快。2. 可以直接更新 HTML。2. 无法直接更新 HTML。3. 如果元素更新,则创建新DOM。3. 如果元素更新,则更新 JSX 。4.
2021-03-23 23:26:33
171
原创 react高频面试题
为什么选择使用框架而不是原生?框架的好处:组件化: 其中以 React 的组件化最为彻底,甚至可以到函数级别的原子组件,高度的组件化可以是我们的工程易于维护、易于组合拓展。天然分层: JQuery 时代的代码大部分情况下是面条代码,耦合严重,现代框架不管是 MVC、MVP还是MVVM 模式都能帮助我们进行分层,代码解耦更易于读写。生态: 现在主流前端框架都自带生态,不管是数据流管理架构还是 UI 库都有成熟的解决方案。开发效率: 现代前端框架都默认自动更新DOM,而非我们手动操作,解放了开发者的
2021-03-23 23:24:13
179
原创 栈的使用算法
栈是什么?一个后进先出的数据结构。JavaScript中没有栈,但可以用Array 实现栈的所有功能。push 入栈pop 出栈const stack=[];stack.push(1);stack.push(2);const item1=stack.pop();const item2=stack.pop();栈的应用场景需要后进先出的场景。比如:十进制转二进制、判断字符串的括号是否有效、函数调用堆栈…场景一:十进制转二进制后出来的余数反而要排到前面。把余数依次入栈,然后再出
2021-03-10 22:57:37
108
原创 时间复杂度和空间复杂度
时间复杂度是什么?一个函数,用大O表示,比如O(1)、O(n)、O(logN)…定性描述该算法的运行时间1,log2n ,n n2n的2次方要比n大n要比log的2n的次方要大log的2n的次方要比1大O(1)let i=0i+=1每次运行这个文件的时候 这个代码只会运行一次O(n)for(let i=0;i<n;i+=1){console.log(i),}因为这个i会运行n次所以他的时间复杂读是O(n)O(1)+O(n)=O(n)let i=0;i+=1;for
2021-03-10 22:32:57
283
原创 利用vue创建一个超级简单的购物车案列,新手小白入手vue网站必备技能哦!!
一、首先先是购物车案例的静态布局<divid="box"><ul><liv-for="(data,index)indatalist"><inputtype="checkbox">{{data}}</li></ul><p>总金额计算:</p><...
2020-11-05 08:55:53
270
原创 vue的文本总是因为刷新一直闪烁这个问题怎么解决?????
在我们新手开发vue的过程中,我们总会遇到各种各样的的小bug 例如我们在利用vue制作小程序的时候,在刷新的时候,我们文本总会一直不停的闪烁,以下代码很好的能够解决这下列问题,<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> [v-
2020-11-03 08:39:34
474
原创 如何用node+erpress 搭建一个文章管理系统的后台服务器
如何用node+erpress 搭建一个文章管理系统的后台服务器?相信许多对Express +node的刚入手的小白而言,服务器怎么写?路由应该怎么搭建,接下来给你带来几步快速解决你的问题1,先安装*$ npm install -g express-generator2,创建项目的命令express -e project3,进入 cd project4,npm install 对初始化的模块进行安装5,使用nodemon 的启动项目 npm install nodemon-g6,使用npm
2020-11-03 08:25:03
294
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人