- 博客(37)
- 收藏
- 关注
RSS订阅原创 微信小程序收藏实现及思路
微信小程序收藏实现及思路在与页面用俩个图片来显示收藏和取消收藏，用wx:if <image class="xiang_tu" wx:if="{{shou}}" src="/image/xiang1.png" ></image> <image class="xiang_tu" wx:if="{{!shou}}" src="/image/xing.png" bindtap="shoucang" data-index="{{list.id}}"></image&
2020-06-25 22:15:01
1303
原创 微信小程序登录思路
微信小程序登录思路在页面可以写一个button <button size="mini" wx:if="{{flag}}" class="member_li" open-type="getUserInfo" bindgetuserinfo="lj">立即登录</button>在api中登录和注册的接口// 注册 getenroll:(code,encryptedData,iv)=>{ // console.log(111) return re
2020-06-24 21:43:58
290
原创 微信小程序实现搜索思路
微信小程序实现搜索思路在页面上写一个搜索分样式，也可以用微信小程序文档里的，绑定search微信小程序文档:https://developers.weixin.qq.com/miniprogram/dev/framework/在你创建的js中的data里定义一个新的数组list搜索:<mp-searchbar bindselectresult="selectResult" bindfocus="yin" bindblur="lishi" search="{{search}}"&g
2020-06-23 18:32:57
524
原创 微信小程序如何封装api接口
微信小程序如何封装api接口一. 小程序接口请求流程二，域名配置 一定要配置https,小程序上配置的域名必须是域名备案的 三、打开微信开发者工具，打开你的项目，点开详情。确认一下域名是否一一匹对。不然会编译失败的哦四，在你的项目中创建一个文件夹http，在里面在创建一个env.js，api.js和request.js（可以自己定义）在env.js里写//设置公共访问url，即环境地址 //commonJS写法--node采用就是该规范 引入requiremodule.export
2020-06-22 23:29:20
3930
2
原创 Promise你怎么理解的
Promise你怎么理解的1.Promise是一种为了避免回调地狱的异步解决方案2.Promise是一种状态机：pending（进行中）、fulfilled（已成功）和rejected（已失败）只有异步操作的结果，可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。3.Promise暴露的API.then(函数1，函数2)函数1：表示成功返回函数2：代表失败返回例如:promise.then(function(value) { // success }, function(erro
2020-06-21 19:49:14
174
原创 async、await
async、awaitasayc的用法，它作为一个关键字放到函数前面，这样普通函数就变为了异步函数异步async函数调用，跟普通函数的使用方式一样异步async函数返回一个promise对象async函数配合await关键字使用(阻塞代码往下执行)是异步方法，但是阻塞式的使用场景async主要来处理异步的操作，需求：执行第一步，将执行第一步的结果返回给第二步使用。在ajax中先拿到一个接口的返回数据，后使用第一部返回的数据执行第二步操作的接口调用，达到异步操作。…模拟出一个摇色子的异
2020-06-20 18:44:03
89
原创 vue路由钩子函数
vue路由钩子函数：路由的钩子函数总结有6个全局的路由钩子函数：beforeEach、afterEachvue router.afterEach（全局后置守卫）router.beforeEach 是页面加载之前，router.afterEach是页面加载之后单个的路由钩子函数：beforeEnter组件内的路由钩子函数：beforeRouteEnter、beforeRouteLeave、beforeRouteUpdate参数都为 (to,from,next)to: (Route路由对象) 即
2020-06-19 22:10:06
97
原创 实现水平居中的方法
实现水平居中的方法第一种：第二种：第三种：第四种：css3的flex实现能让我们的布局变得更加灵活与方便，唯一的就是目前浏览器的兼容性较差。那么第五种方法，我们就使用flex来实现。body{ background: #000; margin-top: 50px;}.pagination{ display: flex; justify-content: center;}.pagination li{ line-height: 25px;
2020-06-18 21:59:34
214
原创 js事件流，dom操作的方法
js事件流，dom操作的方法事件流：事件流：也就是事件触发的顺序事件流包括三个阶段：捕获阶段、目标阶段、冒泡阶段事件冒泡：事件由最具体元素触发，向上传播的过程；处于目标阶段：触发事件的那个节点，（目标元素）；捕获阶段：事件由不具体的元素向下查找，直到找到你触发的那个元素，与事件冒泡相反；阻止冒泡： e.stopPropagation();事件代理（事件委派）：在父级上绑定事件，通过e.target来获取触发的目标。Dom操作的方法通过:nodeType来检测节点类型，增删改查：增：
2020-06-17 20:50:03
109
原创 搜索功能实现思路
搜索功能实现思路获取输入框的值（也称关键字）模糊搜索，精确搜索通过事件触发将获取的值通过ajax请求搜索接口传递给后台后台服务器通过服务端语言（node,PHP,Java）实现接收浏览器请求后端语言查询数据库（Mysql,mongodb）将查询的结果根据搜索接口约定好的json格式返回给浏览器通过前端JS将返回的结果渲染展现到页面上性能优化：可以利用防抖或节流，可以减少服务器压力例如：import _ from 'lodash'<el-input placeholder="请输
2020-06-16 18:40:38
3886
原创 vue封装星星组件评分
<template> <div class="home"> <span v-for="(v,i) in starArrs" :key="i" :class="`${v}`" class="span"></span><p>当前品分数为：{{pay}}</p> </div></template><script>export default { name: 'Star',
2020-06-15 23:59:01
397
1
原创 axios数据封装
axios数据封装安装axiosnpm i axios -Saxios官方github仓库地址：https://github.com/axios/axio在src里在创建个http文件夹创建个request.js用来创建axios实例，默认接口域名url’，默认超时时间request.js（封装数据请求方法）// 基本不用封装，只是对请求的接口地址，超时，报错处理import Axios from 'axios'console.log('request.js中的环境变量:', proc
2020-06-15 08:21:39
108
原创 js图片懒加载
图片懒加载图片懒加载原理：前端工程师在做页面优化的时候，如果页面中是类似图片列表的结构，会考虑使用懒加载技术来优化页面的加载速度用一张图来描述一下在html页面里写，把js引入html页面<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial
2020-06-12 23:18:31
124
原创 封装组件弹框
封装组件弹框在父组件上写<template> <div> <span class="weui-switch" :class="{'weui-switch-on' : me_checked}" :value="value" @click="toggle" ></span> </div></template><script>export defa
2020-06-11 22:58:07
130
原创 深浅拷贝
浅拷贝：浅拷贝的话简单来说就是复制他原来对象的地址，当然他原来的值如果说发生改变的话，那么复制的那个也会发生改变接下来看一下代码：var obj = [1,2,3,4] obj2 = obj obj[0]=4 //相当于obj2复制了obj的地址所以说改变obj的值obj2中的也会发生改变 //相当于是对象之间的复制 console.log(obj) console.log(obj2)深拷贝：深拷贝的话就是去拷贝基本数据类型：比方说numbe
2020-06-04 23:14:47
64
原创 闭包
闭包相当于是函数嵌套函数，内部的函数可以去访问到外部函数的变量，内部的函数返回会在外面被执行。必报的优点：1.变量可以长期驻扎在内存中。2.避免全局变量的污染。3.私有成员的存在。闭包的缺点增大内存的使用量，使用不当会造成内存的泄露要求每个1秒打印1-10// setTimeout是异步执行，异步队列// 先执行同步在执行异步for (var i = 1; i <= 10; i++) { (function (i) { setTimeout(functi
2020-06-01 21:32:26
89
原创 vue过滤器
vue过滤器做什么的使用场景vue过滤器主要用于对渲染出来的数据进行格式化处理。使用场景例如：后台返回的数据性别用0和1表示，但渲染到页面上不能是0和1我得转换为“男“和”女”或是商品价格例如:全局过滤器<template> <!-- 过滤器 --> <ul class="uuu"> <li v-for="(item,key) in list" :key="key"> <p>商品名称: {{it
2020-05-28 13:03:03
125
原创 nextTick的作用和使用场景
nextTick的作用和使用场景？vue中的nextTick主要用于处理数据动态变化后，DOM还未及时更新的问题，用nextTick就可以获取数据更新后最新DOM的变化注意：数据更新和DOM更新不是同步，是异步的使用场景例如：改变dom元素，针对第三方插件的集成<div class="boo"> <div ref="box">{{msg}}</div> <button @click="getMsg">获取消息</button
2020-05-28 11:31:26
1525
原创 vue路由传参
vue路由传参分为俩钟第一种：queryquery: 可以在router-link标签拼接设置/path?参数名=值例如 <li v-for="(item,key) in list" :key="key"> <router-link :to="'/text?id='+item.id">{{item.title}}</router-link> </li>也可以在组建中通过this.route.push来传递参数，在需要获取值的一个组
2020-05-25 21:59:11
159
原创 vue组件通信
vue组件通信一. 你对组件化的理解: 组件树二. vue组件通信：1.父子通讯：父传子在子组件中通过props接受，可以是数组[]或者是对象{}例如： props: { title: { type: String, //检查接收的数据类型 default: '请输入标题', //设置如果没有传递数据时的默认值 required:true //必填项，不传递会报错提醒 } } 注意：不能直接修改props接收过来的值**
2020-05-23 22:22:03
80
原创 asiox封装，怎么使用svg,
怎么使用svgicon图标：img，雪碧图,base64(将图片转换成base64), 字体图标,svg:可以灵活配置svg: 有单个图标通过img引入svg通过直接插入svg通过样式来调整.fen { width:50px; fill:#f00;}多个svg图合成：svg sprites1.从iconfont挑选图标加入购物并下载, 2.解压打开html,找到symbol复制其中的svg代 码3. 粘贴到vue项目public中的index.html中
2020-05-20 21:48:40
448
原创 es6 class类
es6class类javaScript在ES6之前通过函数来模拟一个类（类也称构造函数）ES6通过class来定义类，不是通过函数，但本质上class就是函数定义类的语法糖继承类先通过ES5定义一个类，通过函数实现定义类：//ES5定义一个类，通过函数实现// 定义类 类也称构造函数 function Person(name='李四',age=0){ // 在类中定义将被实例化的对象属性 this.name = name this.age = age /
2020-05-14 16:29:55
72
原创 数组和字符串的扩展方法:
数组和字符串的扩展方法:字符串：主要新增了模板字符串数组新增方法：Array.from:将类数组或迭代对象转换成数组类数组和数组类数组和数组相同点:1.可以通过下标去访问2.可以通过.length来获取类数组的元素个数类数组和数组的区别：类数组不能使用数组的各种api方法，数组没有问题例如：<script> function test(){ //arguments表示接收传递值的类数组 console.log('通过arguments
2020-05-13 13:19:05
221
原创 es6 symbol
Symbol1.Symbol是ES2015新增的基本数据类型2.使用Symbol()函数来定义Symbol类型，并可以通过typeof检测并返回Symbol类型3.用Symbol定义的类型是唯一的,即定义的两个相同的Symbol比较返回值也是false例如：let s = Symbol();console.log(s);let s2 = Symbol("name")console.log(s2)console.log(typeof s2)let s3 = Symbol("age")co
2020-05-12 12:00:59
51
原创 es6 扩展开运算符
扩展开运算符或rest： ……有两个作用：1.将数组转换成数据列表 （展开操作） [3,4,5]=>3,4,5var arr1 = [3, 4, 5]var arr2 = [6, 7, 8]var result = [...arr1, ...arr2] //4, 5, 6, 7, 8console.log(result)2.将数据列表转换成数组(rest操作)// 4, 5, 6, 7, 8 => [4, 5, 6, 7, 8]function sum(...te
2020-05-11 23:13:14
83
原创 es6 set和map
set和mapset：可以理解成不重复数组map：可以理解成是一个对象==注意：这里的map是一个构造函数，不是数组中的map ==** srt,map**定义一个set,set只能存放不重复数据var s = new Set();添加一个值s.add(66);s.add(88);s.add(99);console.log(s.size); //size代表几个add:添加一个值,delete:删除一个值clear：删除所有值通过for of来遍历数据结构如何通过set可
2020-05-11 23:07:28
61
原创 es6 模板字符出
模板字符串模板字符串var obj = { name: "ddd", age: 21, address: "北京"}//原先拼接字符串的方式var msg = "我的姓名"+obj.name+"年龄"+obj.name+"住址"+obj.addressconsole.log(msg)用模板字符串var msg = `我的姓名${obj.name},年龄${obj.name},住址${obj.address}`console.log(msg)...
2020-05-11 22:43:25
54
原创 解构赋值
解构赋值,赋值=左右俩边的类型要一致数组解构var arr = ['hello','vue.sj']var [a,b] = arr;console.log("a",a)console.log("b",b)对象解构var obj = { name:"rmy", age:21, address:"北京"}var {name,address} = obj;console.log('name',name)console.log('address',address)
2020-05-11 22:35:31
59
原创 箭头函数
es6箭头函数箭头函数（）=>{}面试：箭头函数与普通函数区别？语法区别this不同:普通函数this永远指向运行时调用this,谁调用指向谁, 但箭头函数没有自己this，指定父级有function的this,但如果父级没有function继续往上找是否有arguments:普通函数是有arguments, 箭头函数没有是否能实例化, 普通函数可以实例化,箭头函数不行如何定义一个普通函数？定义1：函数声明方式特点:在定义前后位置都可以调用,因为函数声明有函数提升的作用cons
2020-05-11 20:44:02
97
原创 es6 let.var和const
es6常用方法面试常问1.let和const2.箭头函数3.解构赋值4.模板字符串5.set和map6.扩展运算符7.数组和字符串的扩展方法8.import、export9.class10.symbol11.函数的默认参数12.prmoise13.generator、迭代器let、const、varlet和var的区别1. var可以重复定义,let不可以重复定义例如：var count = 0;var count = 1;console.log('count:',c
2020-05-11 19:34:52
103
原创 webpack创建,集成vue
1.webpack是什么：是一种静态资源构建，打包的工具2.会wepbakc的前置知识：会用node.js安装一个包( npm install xxxx --save-dev)3.webpack核心：entry:入口output:出口loader:资源转换器plugin:插件mode:模式4.webpack目前最新稳定版本：4.43还有其他的打包压缩工具：grunt：https://www.gruntjs.net/gulp：https://www.gulpjs.com.cn/fi
2020-05-10 21:47:08
199
原创 在ECMAScript6 中,下面哪个不属于Promise的状态？
在ECMAScript6 中,下面哪个不属于Promise的状态？A. PendingB. RejectedC. ResolvedD. Pause解析Promise对象只有三种状态。异步操作“未完成”（pending）异步操作“已完成”（resolved，又称fulfilled）异步操作“失败”（rejected）这三种的状态的变化途径只有两种。异步操作从“未完成”到“已完成”异步操作从“未完成”到“失败”。这种变化只能发生一次，一旦当前状态变为“已完成”或“失败”，就意味着不会再
2020-05-10 21:19:32
2877
原创 如何用css3实现一个扇形？
思路跟画实体三角形一个道理,只不过多了一个圆角属性<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="i
2020-05-09 21:24:04
425
原创 console.log输出结果分别是什么？
1.console.log(([])?true:false);2.console.log(([]==false?true:false));3.console.log(({}false)?true:false)得到的结果分别是什么?（）正确答案是C解析:“true,true,false”此题考察类型转换，三元运算符先分清是非，再决定今后再决定今后该走哪条路，“”运算符比较“喜欢”Number类型。下面是题目的类型转换结果：Boolean([]); //trueNumber([]); //0
2020-05-09 20:30:43
8417
原创 有关html5标签说法错误的有？
有关html5标签说法错误的有？A. 标签定义声音,比如音乐或其他音频流B. 比如来自一个外部的新闻提供者的一篇新的文章,或者来自blog的文本,或是来自论坛的文本。亦或是来自其他外部源内容C. 标签定义菜单列表。当希望列表单控件时使用改标签D. 标签定义命令按钮,比如单选按钮、复选框或按钮答案 B解析：这里考察HTML标签的使用： 标签定义声音,比如音乐或其他音频流。 A正确 标签定义图形,比如图表和其他图像。标签只是图型容器,您必须使用脚手架绘制图形。 B错误, 标签定义外部
2020-05-09 20:11:48
2287
原创 闭包
闭包闭包:定义 当一个函数的返回值是另外一个函数,而返回的那个函数如果调用了其父函数的内部变量,且返回的那个函数在外部被执行,就产生了闭包.闭包是一个环境,具体指的就是外部函数–高阶函数 closure闭包的三个特性1:函数套函数2:内部函数可以直接访问外部函数的内部变量或参数3:变量或参数不会被垃圾回收机制回收 GC闭包的优点:1:变量长期驻扎在内存中2:避免全局变量的污染3:私有成员的存在闭包的缺点常驻内存 增大内存的使用量 使用不当会造成内存的泄露.内存的泄露的解决？1：
2020-05-08 23:31:41
99
原创 H5新增标签、H5新增的API、CSS
H5新增标签::1、结构标签（1）section：独立内容区块，可以用h1~h6组成大纲，表示文档结构，也可以有章节、页眉、页脚或页眉的其他部分；（2）article：特殊独立区块，表示这篇页眉中的核心内容；（3）aside：标签内容之外与标签内容相关的辅助信息；（4）header：某个区块的头部信息/标题；（5）hgroup：头部信息/标题的补充内容；（6）footer：底部信息；...
2020-05-07 19:03:07
357
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人