xiasohuai的博客

报错信息：安卓手机：permission deniedios手机：scanQRCode:the permission value is offline verifying解决方案：1、确认config的jsApiList参数包含了这个JSAPI前端代码：wx.config中jsApiList里加上'scanQRCode'2、确认IP白名单、js安全域名、网页授权域名IP白名单：【开发/基本配置】-【IP白名单】 js安全域名、网页授权域名：【设置/公众号设置】-【功能设置】-.

报错信息：安卓手机：permission deniedios手机：scanQRCode:the permission value is offline verifying解决方案：1、确认config的jsApiList参数包含了这个JSAPI前端代码：wx.config中jsApiList里加上'scanQRCode'2、确认IP白名单、js安全域名、网页授权域名IP白名单：【开发/基本配置】-【IP白名单】 js安全域名、网页授权域名：【设置/公众号设置】-【功能设置】-.

直接上代码：mixinsPayLoad(res) {//res接受后端的参数，mwebUrl为跳转微信支付路径 // #ifdef H5 window.location.href = res.mwebUrl; // #endif // #ifdef APP-PLUS const platform = uni.getSystemInfoSync().platform const webvie

低版本android他不支持woff2格式的字体,必须要使用woff格式字体,由于从默认iconfont网站上下载来的字体,woff2排在woff之前,所以导致android无法正确识别到woff了@font-face {font-family: "iconfont"; src: url('iconfont.eot?t=1557465831153'); /* IE9 */ src: url('iconfont.eot?t=1557465831153#iefix') format('embedd

<view class="swiper_img"> <uni-swiper-dot :info="info" :current="current" :mode="mode" field="content"> <swiper class="swiper-box" @change="change" :autoplay="true" :interval="300...

一开始我按照普通css的背景图片写法，导致图片找不到。后来查看uni-app官网，找到了解决方案：但是，这种方式在小程序中，还是无法显示，怎么办呢？1.首先，我在js中导入图片import indexBackgroundImage from "@/static/home.png"2.在data中定义data() { return { indexB...

安卓手机：在微信随便打开一个聊天窗口打开网址（打开debug 调试页面）：debugx5.qq.com拉到调试页面的最底端，勾选上所有的缓存项目，点击清除。苹果手机：我的-设置-通用-存储空间-缓存清理 ...

1.获取签名，调用微信api进行位置信息授权获取当前经纬度2.火星经纬度转百度经纬度3.利用百度api转化成对应的省市区详细地址（这里要注意，我们需要引入百度api，及自己的密钥，<script type="text/javascript" src="//api.map.baidu.com/api?v=3.0&ak=自己的密钥"></script>）wxAddress() { let that = this; let u = navi

一般来说vue单页面应用的title在index.html中设置，但是一旦设置就是唯一了，对此有了以下需求：需要实现不同的页面对应不同的title。我们可以用router.beforeEach 来实现router.js{ path: '/personal', component: () => import('../view/home.vue'), ...

微信授权的整个流程：引导用户进入授权页面同意授权，获取code 通过code换取网页授权access_token（与基础支持中的access_token不同） 如果需要，开发者可以刷新网页授权access_token，避免过期 通过网页授权access_token和openid获取用户基本信息（支持UnionID机制）其实说白了，前端只需要干一件事儿，引导用户发起微信授权页面,然后得到...

如果用户在微信客户端中访问第三方网页，公众号可以通过微信网页授权机制，来获取用户基本信息，进而实现业务逻辑。首先我做了一个H5小项目，然后申请公众号，然后在【自定义菜单】中输入想填写的，公众号菜单名称，以及页面地址：然后，我们在我们的前端页面写调用服务器接口，得到授权。当然这里，后端操作的多。前端只需要请求接口即可。前端应该做什么呢？首先，在我们的vue架子下，找到路由rout...

由于 Picker 组件的滚动是用 touch 事件 + translate 实现的，所以我们可以在 Picker 弹层出现的时候禁止页面的默认滚动机制，Picker 弹层消失时解除禁用页面的默认滚动机制解决方案：data () { return { /*---------监听函数--------------*/ handler:function(e){e.preve...

import Vue from 'vue';Vue.directive('blur', { 'bind'(el) { el.addEventListener("click", function(){ window.scrollTo(0,0); }) }}); //在点击页面提交按钮的时候，把滚动条滚到底部就OK了...

移动端页面中有一个input框，点击时弹出软键盘，关闭时页面底部空白出一部分，然后滑动一下又恢复原状了。解决方案： 绑定一个blur事件，当其触发时，使scrollTo为0<input type="text" v-model="teamCodeValue" @blur="inputBlur"> //对应的methods中添加js inputBlur () ...

可以在所有option前，加入一个option,然后设置display:none.以及disabled属性&lt;select v-model="item.value" style="width:60px;"&gt; &lt;option style="display:none" value="" disabled&gt;请选择&lt;/option&gt;

骨架屏可以理解为是当数据还未加载进来前，页面的一个空白版本，一个简单的关键渲染路径。可以看一下下面Facebook的骨架屏实现，可以看到在页面完全渲染完成之前，用户会看到一个样式简单，描绘了当前页面的大致框架的骨架屏页面，然后骨架屏中各个占位部分被实际资源完全替换，这个过程中用户会觉得内容正在逐渐加载即将呈现，降低了用户的焦躁情绪，使得加载过程主观上变得流畅。可以看一下下面的示例图，...

在性能上，防抖和节流还是很重要的，处理不当或者放任不管就容易引起浏览器卡死。我们开发页面经常会遇到一个返回顶部的功能。这个按钮只会在滚动到距离顶部一定位置之后才出现问题代码：mounted(){ var singel_page = document.getElementsByClassName('contentWrap')[0]; singel_page.add...

第一步，给vue页面添加锚点.orange{ color: #f97910;}&lt;template&gt; &lt;div class="productDetail" ref="content"&gt; &lt;div class="tabbar"&gt; &lt;div @click.pr

1.安装npm install --save html2canvas2.引入import html2canvas from 'html2canvas'3.写方法方式一：通过&lt;a&gt;标签，当然这种方式 不适用 于手机端。&lt;div class="save_btn" @click="savecanvas"&gt; 保存图片&lt;/div&gt...

1.安装npm install qrcode --save2.页面引入并使用利用&lt;img src=""&gt;标签，实现二维码图片功能。然后长按保存即可。&lt;template&gt; &lt;div class="qrcode"&gt; &lt;canvas id="canvas" style="display:none&quot

这里用的是flex#app{ display: flex; flex-direction: column;}中间部门写  flex:1;  所以，底部和顶部会被撑开，且固定。（这里的中间部分我用的是h5新标签，当然可以用div来写）。注：这里面的px应当用rem转换，这里我并没有写，没有介绍。写手机端的时候，是一定要转换的。这里主要讲的是，头部和底部固定。全部代码如下：...

通过改变router-view中的key来达到刷新组件的目的。界面上有个刷新按钮，点击刷新的时候，执行函数，改变activeDate的值，为当前的时间戳。这样就会刷新router-view中的内容。&lt;span title="刷新" @click="refresh"&gt;&lt;/span&gt;&lt;router-view :key="activeDate"/&gt;d..

写手机端页面的时候要在meta加入，下面代码：&lt;meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"&gt;  name=”viewport”  说明此meta标签定义视口的属性  initial-scale=1.0   意思是将页面不放大，还是1.0  wi...

在Reina屏幕的手机上，使用CSS设置的1px的边框实际会比视觉稿粗很多。为什么会这样呢？那是因为css中的1px并不等于移动设备（物理像素）的1px。物理像素显示是1个像素代表2个像素，所以出现border为2px。解决方式：伪类 + transform 原理是把原先元素的 border 去掉，然后利用 :before 或者 :after 重做 border ，并 transf...

因为苹果手机input框，会带上圆角效果和阴影效果。很不美观，所以要想去掉，加以下代码即可 。input{ -webkit-appearance: none; border-radius:0;}   

 1.防止手机中页面放大和缩小&lt;meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"/&gt;2. 安卓浏览器看背景图片，有些设备会模糊因为手机分辨率太小，如果按照分辨率来显示网页，字会非常小，安卓手机devicePixoRa...

    1.安装npm install vconsole然后复制 dist/vconsole.min.js 到自己的项目中。2.引入模块(1) 如果未使用 AMD/CMD 规范，可直接在 HTML 中引入 vConsole 模块。为了便于后续扩展，建议在 &lt;head&gt; 中引入：&lt;head&gt; &lt;script src="path/to/vc...

第一种：引入微信js-sdk//在一个地方调用this.weixin()方法，比如说按钮 //写微信支付方法weixin() { var that = this; var url=''; var params = { .....//价格，数量等等一类的 }; axios.post(url...

该方法需引入微信js-sdk ，先npm安装//在一个地方调用this.weixin()方法，比如说按钮//写扫一扫方法weixin() { var that = this; var url=''; var params = { ..... }; axios.post(url,param...

1. 由于tomcat需要jre运行环境，所以你得先装好jdk，并配好环境2. 下载一个Tomcat。点击安装，没啥好说的，首先他会检测到jre环境，后面选择一下你的安装目录，接着下一步下一步就行。3. 简单部署流程：将你的web项目拷贝到tomcat中部署web应用的位置：D:\Program Files\Apache Software Foundation\Tomcat 7.0\...

我们在做手机端项目的时候，肯定想能让项目在真机上快速方便的访问，而不是等着服务端发版才能访问到，那么如何实现呢？那么我们只需要在package.json的dev进行配置--host 0.0.0.0，然后要看你webpack-dev-server起服务的host的ip，比如webpack-dev-server的ip是192.168.1.1，那手机端就访问192.168.1.1:8080即可。...

方式一：可以用watch+vuexwatch: {　　'$route': function (to, from) { // 我这里还是用了Vuex，不过应该不影响理解 this.$store.dispatch('updateActiveTemplateId', this.$route.query.templateId) // 通过更新Vuex...

登录页面案例代码：html代码：&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt; &lt;title&gt;登录&lt;/title&gt; &lt;meta charset="utf-8"&gt; &lt;meta name="viewport" content="width=device-w