- 博客(195)
- 收藏
- 关注
RSS订阅原创 小程序 处理富文本内图片大小
meetDetail.Companies = meetDetail.Companies.replace(/\<img/gi, '<img style="max-width:100%;height:auto" ')
2020-07-11 12:34:32
723
原创 api 文件夹index.js 集合写法
const requireApi = require.context( '.', false, /.js$/)let module = {}// console.log(requireApi)requireApi.keys().forEach((key,index)=>{ if(key==='./index.js') return Object.assign(module,requireApi(key))})export default module
2020-07-04 15:40:22
666
原创 携带token的ajax请求方法封装
//带Token请求const httpTokenRequest = (opts) => { let baseUrl = ''; let token = ""; uni.getStorage({ key: 'token', success: function(ress) { token = ress.data } }); //此token是登录成功后后台返回保存...
2020-05-07 09:12:51
1621
原创 uniapp中自定义导航栏动态获取高度
<template> <view class="coutainer"> <!-- 自定义导航栏空行 --> <view class="status_bar" :style="{'height': height+'rpx'}"> </view> <!-- 导航栏 搜索按钮 和 navigation --> ...
2020-04-20 16:28:30
5073
原创 小程序中 swiper设置圆角在真机上不显示问题
如图swiper { height: 300rpx; width: 710rpx; margin: 0 auto; // 轮播图 圆角 border-radius: 50rpx; // 溢出隐藏 overflow: hidden; // 解决bug代码 transform: translateY(0); // 轮播图加个阴影 box-shadow:0 0 20rpx ...
2020-04-17 11:27:57
682
原创 uniapp中封装ajax方法
ajax.js// 记录调用 request 方法的次数let ajaxTimes = 0// 请求地址的基本路径const baseUrl = 'https://api-hmugo-web.itheima.net/api/public/v1'export function request(params) { // 每次调用 request 方法时，将 ajaxTimes ...
2020-04-09 15:08:43
5127
原创 uniapp中的横向选项卡 轮播图和选项卡结合
<template> <view> <scroll-view class="tabCard" enable-flex scroll-x :scroll-into-view="scrollIntoView" scroll-with-animation> <view class="tab-item" :class="{'tab-active...
2020-04-09 12:53:06
1358
原创 搜索框的防抖和节流
防抖防抖就好像 公交车本来要开 但是此时有人一个一个的上车 要等待最后一个人上车后在开车节流节流就好像是 一盆水 只有等到一个状态 比如说水满了 此时水才会漫出来<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewp...
2020-03-23 19:16:44
2871
原创 vue中使用高德地图 amap--基础使用方法
vue-amap 官网：https://elemefe.github.io/vue-amap/#/zh-cn/introduction/install高德地图开放平台: https://lbs.amap.com/dev/key/app安装npm install vue-amap --savemain.js中 引入插件并使用// 高德地图import VueAMap from 'vue...
2020-03-22 16:18:27
4100
原创 购物车中 商品的选中状态之后的一些业务逻辑操作
如图，当我们点击 商品的单选框之后 我们要对数据进行处理总结一下 业务逻辑：以点击 单个复选框为列当点击 商品的复选框之后 传入当前商品的id拿到商品列表，在商品列表中找到所点击商品对象，更改其对象中isChecked字段的值此时商品列表的数据已被更改。还没有同步到界面中重新判定 全选按钮的状态重新判定 商品数量 和 商品总价全部判定好了之后 再写入各自的数据中 界面就会同步...
2020-03-19 10:12:30
870
原创 自用的获取时间 传值是获取剩余时间 不传是获取当前时间
// pages/index1/index1.jsPage({ /** * 页面的初始数据 */ data: { time:'' }, /** * 生命周期函数--监听页面显示 */ onShow: function () { setInterval(() => { ...
2020-03-18 21:49:36
133
原创 标题文字超出2行 则隐藏后面显示省略号
css小技巧 overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
2020-03-18 18:30:21
430
原创 微信小程序中处理 获取用户地址的回调
handleChooseAddress () { // 选择用户地址，初次调用该方法会弹出授权窗口，授权信息会被保存到 scope.address 属性中 // 如果用户点击的是【取消】，scope.address 属性的值为 false // 如果用户点击的是【确定】，scope.address 属性的值为 true // wx.chooseAddress({...
2020-03-18 17:24:30
1128
原创 微信小程序中 button丢失其默认样式
ps: 微信官方没有提供 打开客服的api 所以只能通过button来打开客服实现思路：1.让botton按钮 宽度高度 百分百充斥整个盒子2. 外面盒子设置相对定位 button设置绝对定位3. button设置透明度 设置为0.tools view button { width: 100%; height: 100%; position: absolute;...
2020-03-18 11:56:42
534
原创 小程序中封装的ajax 方法
工具 ajax.js代码// 记录调用 request 方法的次数let ajaxTimes = 0// 请求地址的基本路径const baseUrl = 'https://api-hmugo-web.itheima.net/api/public/v1'export function request(params) { // 每次调用 request 方法时，将 ajaxT...
2020-03-17 17:57:45
341
原创 原生JS实现vue中双向数据绑定
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</titl...
2020-03-15 11:31:46
216
原创 微信小程序种利用轮播图实现tab栏切换
js文件 navList: ['推荐', '视频', '热点', '娱乐'], idx: 0 }, handleChange (e) { var idx = e.target.dataset.idx this.setData({ idx }) }, hand...
2020-03-12 20:09:49
510
原创 小程序种的轮播图高度的算法
height: 原图的height * 现在手机屏幕尺寸的width/ 原图的width;<swiper indicator-dots autoplay circular> <swiper-item> <image src="https://res.wx.qq.com/wxdoc/dist/assets/img/0.4cb0...
2020-03-11 20:29:31
213
原创 小程序的 rpx布局问题
在实际项目开发过程当中 如果UI给的图是 750px的 那么我们就很好上手直接把量出来的数据 后面加上rpx就好了。但是 如果设计图不是750px呢？在这里假设 UI给的图是 480px的图（没有放大两倍，直接原图）我们就需要进行rpx的一个转换了 480px = 750rpx; 1px = 750 / 480 rpx; 假如在 UI图上量出来的宽是 75px 那么 我们需要这么写...
2020-03-10 18:15:54
345
原创 H5 IOS input 聚焦时。页面整个被推上去了，键盘收起页面未下移 bug
https://blog.csdn.net/qq1014156094/article/details/88698647?depth_1-utm_source=distribute.pc_relevant.none-task&utm_source=distribute.pc_relevant.none-task
2020-03-10 08:54:37
933
原创 购物车的数据应该保存在哪？
目前我们使用购物车的存储方式主要有：Session方式，Cookie方式，数据库存储，我们来一一分析优缺点。1.Session（Memcached）方式优点：购物车信息保存在服务端，可以保存1M 信息。缺点：对于大型网站会占有过多的服务器内存资源，造成服务器压力过大。Session保存的信息会在用户退出登录后丢失。用户下次登录，购物车中商品信息丢失，用户只能从新选择。2.Cookie方式...
2020-03-09 22:36:22
6925
2
原创 ajax兼容低版本浏览器
<script type="text/javascript">function createAjax(){ var request=false; //window对象中有XMLHttpRequest存在就是非IE，有可能是（IE7，IE8） if(window.XMLHttpRequest){ request=...
2020-03-09 22:06:41
176
原创 vue的双向数据绑定的原理
VUE实现双向数据绑定的原理就是利用了 Object.defineProperty()这个方法重新定义了对象获取属性值(get)和设置属性值(set)的操作来实现的。代码演示：defineProperty的用法var obj = { };var name;//第一个参数：定义属性的对象。//第二个参数：要定义或修改的属性的名称。//第三个参数：将被定义或修改的属性描述符。Object.de...
2020-03-09 09:06:53
65
原创 用js实现千位分隔符
正则表达式<span style="font-size:14px;">function format (num) { var reg=/\d{1,3}(?=(\d{3})+$)/g; return (num + '').replace(reg, '$&,');}</span>正常思维算法function format(num){ nu...
2020-03-06 08:40:41
232
原创 react中redux的store.js样板文件
import { createStore } from 'redux'const initState = { list: [1,2,3,4,5]}function reducer(state, action) { return state}const store = createStore(reducer, initState)export default store...
2020-03-05 18:25:43
335
原创 create-react-app 脚手架工具完善自己所需要的入口文件
index.jsimport React from 'react'import ReactDOM from 'react-dom'import App from './views/App'ReactDOM.render( <App/>, document.getElementById('app'))App.jsimport React from 'react'...
2020-03-02 14:51:06
423
原创 提高网站性能的常见方法
Web前端性能优化浏览器访问优化减少http请求：HTTP协议是无状态的应用层协议，意味着每次HTTP请求都需要简历通信链路，进行数据传输，而在服务器端，每个HTTP都需要启动独立的线程去处理，这些通信和服务的开销都很昂贵，减少HTTP请求的数目可有效提高访问性能。减少HTTP请求的主要手段是合并CSS，合并JavaScript，合并图片。将浏览器一次访问需要的JavaScript,CSS...
2020-03-02 11:46:40
219
原创 移动端开发 main.js入口文件
import Vue from 'vue'import App from './App.vue'import router from './router'import store from './store'// rem适配文件import './assets/js/app'// css重置样式import './assets/css/reset.css'// 引入munt-ui...
2020-02-21 09:53:22
407
原创 移动端开发 自适应rem js文件
(function(win) { var docEl = win.document.documentElement; var time; function refreshRem() { var width = docEl.getBoundingClientRect().width; i...
2020-02-19 12:07:59
422
原创 reset.css
@charset "utf-8";/*=========================Reset_start==========================*/body,h1,h2,h3,h4,h5,h6,div,p,dl,dt,dd,ol,ul,li,form,table,th,td,a,img,span,strong,var,em,...
2020-02-19 12:06:31
87
原创 resset-rem.css
@charset "utf-8";/*=========================Reset_start==========================*/body,h1,h2,h3,h4,h5,h6,div,p,dl,dt,dd,ol,ul,li,form,table,th,td,a,img,span,strong,var,em,input,textarea,select,opti...
2020-02-19 09:59:25
158
原创 移动端页面rem+media写法过程
移动端页面rem+media写法过程1.先看psd是多宽的设计图 假设是640的设计图 设计图都是设备宽度的2倍2.在iphone5下进行调试 所有的元素的宽高设为量出来的值/2 这个时候还是px3.引入reset-rem.css 这个里面用媒体查询定义了不用屏幕下 根元素的字体大小4.把px转化为rem 把css样式复制到以下网址进行转化 在转化的时候要填写转化的单位如果是...
2020-02-18 16:34:54
207
原创 box-sizing 的计算方式
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> #d1,#d2{ width:200px; ...
2020-02-18 16:04:30
178
原创 vue中this.$set()方法
<!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-...
2020-02-18 15:27:36
1204
原创 vue中this.$nextTick()方法
<!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-...
2020-02-18 15:26:24
448
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人