- 博客(59)
- 资源 (3)
- 问答 (1)
- 收藏
- 关注
原创 判断是微信环境还是支付宝环境
判断是微信环境还是支付宝环境 iswxorapipay () { var ua = window.navigator.userAgent.toLowerCase(); var iswxmini = '' return new Promise((resolve, reject) => { if (ua.indexOf('micromessenger') > -1) { wx.miniProgram.getEnv(function (res)
2022-05-24 09:32:50
1424
原创 支付宝微信支付方式的选择
32.支付宝微信的单选框选择场景: 一个h5网页支付页面,需要同时展现支付宝和微信两种支付方式实现目标:实现步骤:在项目中,安装并引入vant的相关组件:RadioGroup, Radio, Cell, CellGroup和样式页面代码实现 <div> <div class="paytype" v-show="paylist.length!==0" > <div class="title">请选择自费支付方
2022-05-13 10:56:39
954
原创 mint-ui实现轮播图
mint-ui实现轮播图使用mint-uinpm安装mint-uinpm install mint-ui -S一定要安装2版本以上的,1版本的会报错在main.js中引入import MintUI from ‘mint-ui’import ‘mint-ui/lib/style.css’Vue.use(MintUI)在需要的地方引入swipe组件import {Swipe, SwipeItem} from ‘mint-ui’import ‘mint-ui/lib/style.
2022-03-09 20:49:07
881
原创 身份证号加密显示,只显示前后两位
身份证号加密显示在页面中,显示前两位和末尾两位例如:330110200010198500 ------- 33**************00410102201807248396 ------- 41**************96 encryptPaperNo (card) { // 加密身份证号 let enCard = [] enCard.push(card[0]) enCard.push(card[1]) for (l
2022-01-06 15:10:15
1894
原创 姓名加星号显示,只显示第一位和最后一位
姓名加密显示,只显示第一位和最后一位例如:张三---------张*王麻子 ---------王*子王二麻子 -------王**子encryptName (name) { // 加密姓名 let enName = [] if (name.length === 2) { return name[0] + '*' } else { let num = name.length - 2 enName.pu
2022-01-06 15:01:52
1045
原创 vue的父子组件双向数据绑定
vue中父子组件数据双向绑定父组件父组件中引入子组件,并在template中使用父组件中的数据使用:data.sync用于动态实时获取子组件数据<template> <dele :data.sync="delShow" v-show="delShow" /></template>import dele from './../components/Del.vue'export default { components: { dele
2022-01-06 14:41:18
879
原创 先勾选协议选框,才能进行下一步
先勾选协议选框,才能进行下一步效果图:<template> <div class="con"> <div> <div class="input_con"> <div>真实姓名</div> <input v-model.trim="realname" class="input" type="text" placeholder="请输入姓名" /> &l
2022-01-05 11:50:00
1199
原创 删除input的首尾空格
删除input的首尾空格.trim() :删除首尾的空白字符 <input v-model.trim="idcard" class="input" type="text" placeholder="请输入身份证号" />
2022-01-04 11:17:47
802
原创 微信小程序获得用户地理位置
微信小程序获得用户地理位置//app.json"permission": { "scope.userLocation": { "desc": "你的位置信息将用于小程序位置接口的效果展示" } },wx.getLocation({ type: 'wgs84', success (res) { const latitude = res.latitude const longitud
2021-12-09 15:50:35
216
原创 微信小程序嵌套h5页面怎么实现小程序支付
小程序嵌套h5页面怎么实现小程序支付小程序嵌套h5页面怎么实现小程序支付小程序中嵌套h5页面,但是不能再h5页面拉起小程序支付,这时是需要小程序方拉起支付目前的流程,外链发送订单请求拿到预支付的prepay_id和其他参数,小程序这边只需要将它传过来的参数(wxJson)接收并解析完拼接到wx.requestPayment微信调起支付的接口参数中用来发起微信支付<--interHosp.wxml--><view bindtap="gopay" style="color: red;"
2021-12-01 10:07:04
6396
3
原创 网页嵌入高德地图
网页嵌入高德地图搜索场景:在app中需要有导航功能,定位到某个医院的地点,不用插入高德地图sdk可以直接使用将高德地图的地址直接拼接到window.location中gomap(address){ window.location.href = `https://m.amap.com/search/mapview/keywords=${address}` }...
2021-11-30 16:28:58
2247
原创 input搜索框在ios系统中兼容问题
input搜索与ios适配兼容问题场景:h5页面在手机上嵌入时,会有搜索框并且改变键盘“搜索”字体的需求问题1:ios下input中type=“search”,键盘中不变“搜索”的问题 <input type="search" placeholder="搜索生" v-model="searchValue" @keypress.13="goSearch()" /> 解决:在input标签的外面嵌套form
2021-11-24 16:53:16
2847
原创 微信小程序navigateTo跳转问题
新建组件在pages文件夹中检查组件四件套是否存在,最好在四件套最外侧有文件夹包裹,方便管理检查app.json中的pages数组里是否存在页面路径,如果没有,需要手动添加在页面中使用navigateTo跳转时,不要相信自动补全的,会报错页面找不到 wx.navigateTo({ url:`./../netHospital/netHospital.html` })报错如下:正确写法不要带后缀.wxml,否则跳转不过去,测试后正常跳转wx.navigateTo.
2021-11-17 16:33:39
818
原创 MVVM模式
对MVVM的理解model view view-modelmodel:表数据模型,仅关注数据本身,不关心任何行为view:视图,用户操作界面,当view-model对model进行更新时,会通过数据绑定更新到view上view-model:业务逻辑层,桥梁的作用,作用:简化了界面与业务的依赖,解决了数据频繁更新,mvvm在使用中,利用双向绑定技术,使得model变化时,vm会自动更新,而vm变化时,model也会更新...
2021-09-22 14:21:29
67
原创 简述从输入URL到浏览器显示页面发生了什么?
从输入URL到浏览器显示页面发生了什么?DNS域名解析出IP地址,找到该网址的服务器, 先去浏览器的历史记录中看是否访问过该网址,是否已经缓存过,–》缓存过的话,去本地DNS找,去计算机的host文件,文件中有域名和IP之间的映射关系;本地没有域名解析服务器,就去网络上找,(全球的13台根域名服务器)根服务器中找是否有域名与IP的映射关系,找到后缓存,–》请求服务器,服务器将用户请求的资源传过来,–》通过传输层协议TCP协议(三次握手过程)建立连接,与客户端浏览器建立连接,–》将全部资源传递过来后把
2021-09-22 10:15:50
93
原创 vue中v-for中key值作用和原理
Vue中v-for中key值作用和原理v-for中,渲染列表时用到key,采用different算法就地渲染/就地复用,没有key,在每一次for的每一个项目改变时都是重新遍历整个列表,使用key时就只修改该改的那一个 会重新渲染dom元素或这标签key的作用主要是为了高效的更新虚拟DOM,在vue中使用过相同标签名元素的过渡切换时,也会使用到key属性,目的是为了让vue可以区分他们。...
2021-09-22 10:11:08
294
原创 cookie localStorage SessionStorage的区别
cookie localStorage SessionStorage的区别共同点:都是保存在浏览器端,且是同源的不同点:cookie是为了表示用户身份二存储在用户本地终端上的数据,时钟在同源http请求中携带,在浏览器和服务器端来回传递,另外两个不会自动把数据发给服务器,仅存在本地保存存储大小:cookie不大于4k,梁歪两个数据大,可达5M数据有效期:cookie在有效期内有效,session一个会话内有效,即在浏览器窗口关闭前有效,local时钟有效,永久保存数据作用域:cookie在
2021-09-22 10:00:40
153
原创 Vue中computed watch methods 的区别
computed、watch methods 的区别⭐️⭐️⭐️watch支持异步,computed不支持异步computed会有进行缓存,watch不会计算属性与methods中的函数的差别1.计算属性可缓存计算结果,反复使用,避免重复计算2.methods中的函数不会缓存计算结果,可能会导致重复的计算三者的区别methods中保存普通函数它更倾向于执行一项操作,而不是计算出一个值如果methods中函数计算返回一个值,它也不会被缓存,可能造成重复的计算调用时,要么是
2021-09-18 09:26:34
159
原创 单页面应用的首屏加载慢的问题
首屏加载太慢的问题原因:因为第一次要把所有页面组件内容下载下来解决:异步延迟加载(脚手架默认选择)打包时,每个文件打包为单独文件首屏加载时,只强制加载第一个组件的内容,后续组件由底层程序异步加载优点:不影响首屏加载速度,又能实现单页面应用的效果缺点:因为即使用户不看其他组件的内容,也会下载其他组件,浪费网络流量懒加载(可通过配置脚手架实现)打包时,每个文件打包为单独文件首屏加载时,不会下载其他组件只有当用户切换到其他某个组件时,才临时下载用户想看的组件优点:
2021-09-16 19:35:50
475
原创 FlatList组件
React Native 之FlatList组件 ScrollView组件与FlatList组件同为自带滚动效果的组件,两者之间有所差异,各有所优势。与ScrollView相比较,FlatLis可以通过data属性进行自动遍历,根据其中的结果显示相应的视图。 FlatList一个高性能的列表组件,具有多个属性(多列、下拉刷新、触底加载更多、间隔组件、自动滚动、横向滚动、表头、表尾…),更加方便。import React, {Component} from 'react';import { A
2021-09-15 23:19:56
336
原创 创建React Native项目
React Native及项目开启React Native的产品是真正的手机端原生代码:得益于其特殊的编译环境,可以使用JS来开发项目,最终通过编译环境改变为原生的android或iOS代码生成项目包:npx react-native init 包名连接模拟器:步骤顺序非常重要先开启adb服务器:adb devices开启模拟器侦测设备:adb devices运行,在项目目录下执行:npm run android 或 yarn run android(推荐使用,成功概率高)把编译成功
2021-09-10 19:23:50
862
原创 Vue的概述
Vue一.概述【1】vue是什么?第三方开发的基于MVVM设计模式的渐进式的:可以逐步在项目中使用vue技术,可以和其他技术混搭纯前端:单靠浏览器就可以运行,不需要任何后端技术js框架:可以自动化的完成大部分重复的劳动,提高开发效率【2】何时使用以数据操作(增删改查)为主的项目,可以使用vue框架开发比如: 饿了么,每天,大众点评,淘宝,京东,今日头条,微博,网易云音乐,小红书,知乎,自如,链家,携程,去哪儿…不是以数据操作为主: 大型游戏,微信/qq(即时通信),抖音,爱奇艺【
2021-07-19 20:47:08
420
原创 初步认识Vue
Vue一.概述【1】vue是什么?第三方开发的基于MVVM设计模式的渐进式的:可以逐步在项目中使用vue技术,可以和其他技术混搭纯前端:单靠浏览器就可以运行,不需要任何后端技术js框架:可以自动化的完成大部分重复的劳动,提高开发效率【2】何时使用以数据操作(增删改查)为主的项目,可以使用vue框架开发比如: 饿了么,每天,大众点评,淘宝,京东,今日头条,微博,网易云音乐,小红书,知乎,自如,链家,携程,去哪儿…不是以数据操作为主: 大型游戏,微信/qq(即时通信),抖音,爱奇艺【
2021-07-19 20:43:02
262
原创 DOM及DOM查找
1.DOM【1】定义:专门操作网页内容的一套对象和函数的总称【2】为什么使用DOM:ES标准中只规定了js语言的核心语法,没有规定如何使用js操作网页的内容。【3】何时:今后,只要想操作网页中的内容,只能用DOM,JQuery和框架都是对DOM的简化【3】DOM标准:国际标准,由W3C负责制定并维护,几乎所有浏览器都兼容2.DOM树【1】定义:一个网页的所有内容是在浏览器内存中以树形结构保存的。【2】为什么:树形结构是能够最直观的展现上下级包含关系的结构。而网页内容中的元素结构,也是上下级包含
2021-07-10 15:02:34
1097
原创 es6中的class
6.7class【1】问题:旧的js中,构造函数和原型对象是分开定义的,不符合“封装”的概念【2】解决:今后只要在ES6中创建一种新的类型,包含构造函数+原型对象,都可以使用class创建【3】定义:class是程序中专门集中保存一种类型的所有子对象的统一属性结构和方法定义的程序结构。【4】如何定义class:3句话 i:用class{}包裹原构造函数+原型对象方法 ii:原构造函数名升级为整个class的名字,所有构造函数统一更名为"constructor" iii:原型对象中的
2021-07-07 20:05:36
529
原创 数组解构、对象解构、参数解构
6.6解构destruct【1】问题:旧js中,要想使用对象中的成员,或数字中的元素,都必须带着"对象名."或"数组名[]"前缀。但是,实际开发中,对象或数组的嵌套结构可能很深。前缀就可能写很长: “对象名.子对象名.子对象名…”,非常麻烦。【2】何时使用:如果遇到复杂的对象或数组时,都可以通过解构的方式,来减少数组或对象的嵌套结构,便于使用【3】如何使用:分为3种i:数组解构 1).功能:从一个复杂的数组中只提取出需要的元素单独使用 2).如何使用:var [变量1,变量2,...
2021-07-07 19:57:22
1224
原创 拆散数组和...
6.5.3展开运算符spread【1】原因:数组的拆散之前学习过apply函数,但是apply函数不那么好用,因为apply的本职工作不是拆散数组,而是替换this,是在替换this的同时拆散的数组【2】解决:如果希望单纯的拆散数组,就使用 … 展开运算符【3】如何使用:在调用函数时,函数名(...数组名);【4】原理:…先将数组拆散成多个实参值,再依次分别传给函数的每个形参变量。【5】…的作用: i:定义函数时,形参列表中的…表示收集 ii:调用函数时,实参列表中的…表示拆散【6】
2021-07-07 19:35:24
184
原创 ES6的剩余参数rest
6.6剩余参数rest【1】问题:箭头函数不支持arguments,如果箭头函数遇到参数个数不确定的情况,怎么办?【2】解决:只要在ES6箭头函数中遇到参数个数不确定的情况,都可以使用剩余参数语法来代替arguments接收参数的值【3】如何使用 var 函数名=( ...数组名 )=>{ //将来传入函数的所有实参值,都会被...收集起来,保存到...会指定的数组中。 }【4】优点 i:支持箭头函数ii:生成的数组是纯正的数组类型,可以使用数组的所有函
2021-07-06 20:09:32
186
原创 ES6的参数增强
6.5参数增强参数默认值default【1】定义:调用函数时,即使不传入实参值,形参变量也有默认值可用,而不会是undefined【2】何时使用:希望即使不传入实参值,形参也有默认值使用【3】如何使用:定义函数时: function 函数名(形参1=默认值1, 形参2=默认值2, ...){ //调用函数时,给形参传了实参值,则首选用户传入的实参值。如果没有给形参传是实参值,则形参默认启用=右边的默认值。 }【4】存在问题:只能连续修改前一个或前几个或全部的值,而不能只
2021-07-06 20:08:51
142
原创 ES6的for of循环
6.4 for of循环【1】功能:可以遍历数字下标的数组或类数组对象【2】优点:与es6中的箭头函数,很简化 缺点:无法用于遍历类数组对象【3】使用:只要是遍历数组下标的,都可以for of替换普通for循环和forEach循环【4】原理 for(var 变量 of 索引数组/类数组对象){ //of会依次取出数组或类数组对象中每个属性值 //自动保存of前的变量中 }【5】存在的问题i:无法获得下标位置i,只能获得元素值ii:无法控制遍历的顺序或步调
2021-07-06 20:08:02
731
原创 ES6的let声明变量
6.3 let【1】var的两个问题 i:会被声明提前——打乱程序的正常执行顺序 ii:没有块级作用域——代码块内的变量会超出其范围,影响到外部变量【2】块级作用域:指的是对象{}和function的{}之外,其余if else、for、等程序结构的{}范围,在其他语言中称为块级作用域。但是,在js中这些{},都不是作用域。拦不住内部的局部变量声明被提前。【3】使用let的优点 i:不会被声明提前——保证程序顺序执行 ii:拥有块级作用域——作用域内的变量不再影响作用域外的变量
2021-07-06 20:06:45
313
原创 ES6中的箭头函数
6.2箭头函数【1】定义:对绝大多数匿名函数的简写【2】为什么:反复写function来定义函数很繁琐【3】何时使用:几乎所有匿名函数都可以用箭头函数简化【4】如何使用:3句话 步骤 i:去掉function,在()和{}之间加=> ii:如果只有一个形参,则可以省略() iii:如果函数体只有一句话,则可以省略{},如果函数体仅剩的一句话还是return,则必须去掉return【5】示例:// function add(a,b){// retur
2021-07-06 20:05:50
125
原创 ES6的模板字符串
6.ES66.1模板字符串【1】定义:支持换行、动态拼接内容的特殊字符串格式【2】为什么使用它:旧的js中,旧的js中,拼接字符串使用的+,易于与算数计算的+混淆【3】如何使用:3句话 i:整个字符串用一对反引号``包裹 ii:在反引号中可以写单引号,双引号、换行等 iii:在反引号中凡是动态拼接的变量或js表达式都要放在${}【4】${}中的内容 可以放:变量、算术计算、三目、对象属性、创建对象、调用函数、访问数组元素——有返回值的合法的js表达式 不能放:没有返回
2021-07-06 20:04:42
123
移动端怎么实现pdf预览和下载
2022-05-27
TA创建的收藏夹 TA关注的收藏夹
TA关注的人