云间月

基于 uni-app 开发的 h5 应用，安卓端正常，ios 显示异常。当页面滚动后 IOS 嵌入的 web-view 内容莫名被置顶隐藏了，导致内容不可见。

虽然问题得以解决，却没有找到根本原因，或许只是误打误撞解决了，说不定未来会作为隐患爆发。如果大家有知道具体原因或者更好方法的，欢迎大家留言讨论。（完）

本文通过伪代码的形式，介绍了Vue 2项目中解决v-for和v-if冲突的两种方案，具体使用何种方法需要视业务需求和数据结构而定。

写在前面近期把之前写的一个Vue老项目进行了一番重构，发现其中有许多重复使用的css样式代码，决定把重复使用的样式代码提取到公共的scss文件中，并全局使用，本来以为是一个比较简单的工作，但是在操作的过程中，还是碰到了不少问题。这里简单记录下，并分享给有需要的人，希望对大家有所帮助。方法 1步骤 1：根目录新建 vue.config.js 文件步骤 2：将下述代码添加到 vue.config.js 文件中module.exports = { css: {&nbsp

如何获取小程序指定页面的路径文章目录如何获取小程序指定页面的路径1️⃣ 写在前面2️⃣ 准备工作3️⃣ 获取小程序的原始id、appid等信息???? 打开目标小程序4️⃣ 通过公众号获取小程序指定页面路径???? 3.1 登录公众号后台,点击【新建图文】；???? 3.2 在新建文章中点击插入【小程序】???? 3.3 输入步骤1复制的gh_id 或appid 点击【搜索】目标小程序，点击目标小程序点击【下一步】???? 3.4 详细信息页面，点击【获取更多页面路径】???? 3.5 在弹窗中输入自

1️⃣ 写在前面由于业务需要，需要在应用中集成数据打印功能，由于项目是基于uni-app 开发并发布成微信小程序，查阅了官方的开发文档在技术上是可实现的。同时在淘宝上咨询了蓝牙打印机的卖家，确认蓝牙打印机是否具备自定义开发的功能。最终选择了佳博的GP-2120-TU系列蓝牙打印机，支持标签模式和票据模式。2️⃣ 蓝牙连接流程关于连接蓝牙的操作和API 微信小程序和uni-app 的API接口规范都是一样的，只不过微信小程序是挂载到wx 对象上，而uni-app则是挂载在了uni 对象上。使用uni-

【已解决】（uni-app）IOS 端 H5 应用无法发起请求，请求状态码为0，错误描述为request:fail目录【已解决】（uni-app）IOS 端 H5 应用无法发起请求，请求状态码为0，错误描述为request:fail1️⃣ 问题描述2️⃣ 问题分析???? 2.1 分析依赖问题???? 2.2 分析uni-app版本问题???? 2.3 引入vconsole 进一步分析问题3️⃣ 进一步定位问题4️⃣ 解决办法???? 4.1 跨域解决???? 4.2 修改请求头配置5️⃣ 总结1️⃣

UNI-APP H5应用白屏（空白页）解决方案写在前面        最近公司有一些临时业务急需上线，考虑到H5应用测试部署的便捷性，因此从技术上采用H5网页的方式快速响应业务的需求，由于自己对uni-app 比较熟悉，之前也有用过uni-app开发过微信小程序，整理体验都还不错，这次也就采取uni-app开发H5应用，结果开发测试都还好，上线之后部分IOS用户反馈应用无法打开，具体现象表现为链接打开显示空白页、白屏。针对这

解决Invalid handler for event "click":问题上一篇文章介绍了如何搭建一个基于vue和ElementUi 的项目，当我在项目中添加 一个button按钮，并未这个按钮添加一个@click事件 <el-button type="primary" icon="el-icon-edit" circle @click="addNew" ></...

Win10客户端 ssh 远程连接 win server 2008 R2服务器写在前面如题，本文介绍的是在Win10客户端 和 win server 2008 R2服务器 之间建立 ssh 连接。网上很多关于ssh介绍的教程文章，但是都没有讲清楚基本环境，导致读者看完后找不到头脑。再多说一句，服务器是阿里云的服务器，操作系统是Windows Server 2008 R2 企业版64位中文版。开始配置win10 客户端win 10 系统已经内置了open SSH 客户端和服务端，因此在win 10

【Bug日志】Vue computed 报错：Computed property was assigned to but it has no setter 错误原因分析与解决办法错误描述最近在封装Vue组件时，借助Vue的Computed属性监听父组件传递到子组件的数据，但是开发调试过程中控制台取提示Computed property was assigned to but it has no setter 错误。控制台报错如下：错误分析根据控制台错误提示，组件中定义的computed属性缺少se

VUE项目取消Eslint校验为了保证代码风格的一致性，通常在项目中集成Eslint 用作规则检查。但是在开发调试的时候，过多的Eslint 警告，常常给调试产生干扰，影响体验。因此在前期开发调试，尤其是debug的时候，我们可以暂时取消Eslint检验，毕竟让代码“跑起来”是开发者的第一要务！直接注释掉Eslint 规则在编辑器中搜索“createLintingRule”进入webpack.base.conf.js注释掉Eslint规则同时需要将有关createLintingRule

Vue项目打包部署到GitHub Pages前言关于什么是github pages？怎样创建github 仓库上传本地项目到GitHub远程仓库？等基本操作本文不再赘述，初学者可以通过搜索找到大量文章教程。本文重点在于：如何将vue项目源码（含dist目录）同步到到github仓库，同时单独将项目下的dist目录同步到gh-pages分支以便使用GitHub pages 发布和预览静态网页。上述问题，作者以往的做法是将Vue项目源码托管到源码仓库，然后另外创建一个webpage仓库管理前期

【Bug日记】VUE项目vuex store/index.js 引入 router/index.js路由配置引入结果为undefined???? 问题描述Vue项目结合element UI 搭建后台管理系统，再vuex 的store/index.js 文件中引入router/index.js初始路由表，结果后台打印引入结果为undefined。详细见图：Demo代码如下：router/index.jsimport Vue from 'vue';import VueRouter from '

????【Bug日记】 Element-UI级联选择器el-cascader报错Cannot read property level of null????问题描述使用element-ui 级联选择器el-cascader，其数据源options需要根据用户操作·动态切换·，此时若没有进行级联选择操作，动态切换options不会产生错误，一旦用户进行了级联选择，那么下一次切换options数据源时便会报错TypeError: Cannot read property 'level' of null*

【踩坑】npm 包更新无效???? 问题描述发布了一个npm包，发布后随即发现一个小bug,便在本地项目中修复，修复后使用包更新指令npm version patch更新,更新后发现网上npm版本并没有同步更新。于是又执行了如下指令，同样线上版本没有同步更新。npm version patch更新一个补丁npm version minor更新一个小改动npm version major更新一个大改动### ????问题原因使用npm version patch等指令仅是修改包的版本属性，执

【踩坑】vue-cli创建uni-app编译到微信小程序报Uncaught ReferenceError: regeneratorRuntime is not defined????错误描述见图????问题原因小程序未支持async / await使用的方法，在小程序中直接使用会出现上诉错误????解决办法新版本小程序已支持async / await，需在设置中开启增强编译，如图：???? 参考博客参考文章（完）...

【Bug日记】POST请求，后台无法获取到参数郁闷！前端时间刚针对POST请求常见错误做了个总结，今天在前后端接口对接中又遇到了POST请求相关问题！????问题描述前端调用后端POST接口，向后台提交一个字符串数据，结果接口一直返回参数格式不正确，打开调试才知道参数未能被后端正确解析。然而后端本地调试一切正常，看来锅在前端无疑了。????问题定位后端接受JSON格式参数，然而 抓取axios POST请求发现Content-Type为application/x-www-form-urlenc

POST请求常见错误及解决办法前后端分离 已经是web开发的主流，在前后端对接的过程中难免会碰到各式各样的问题，本文对近期项目中遇到的与 POST请求 有关的问题做了一个简要的汇总和分析，并列出了与之相关的解决办法。【????问题一】POST请求发生服务器500错误????‍????问题描述一次调用POST请求过程中，接口报500错误，接口错误属于服务器内部错误，原以为是后台的接口有问题，立马将500问题向后台反馈，然而后台却告知接口测试正常。看来问题的根源在前端，我仔细看了看代码之后发行

uni-app 开发华为 微码小程序文章目录uni-app 开发华为 微码小程序背景通过uni-app生成一个h5应用通过微码开发者工具新建一个微码应用进阶官方解决方案背景之前一直使用uni-app开发小程序、H5应用。近期公司有意向使用华为的welink产品作为移动OA。正好近期项目不是特别忙，在工作之余花了点时间了解了下welink产品以及其小程序平台。​ 通过深入了解，发现其微码小程序api同uni-app api非常类似，于是想着能否通过uni-app开发微码小程序，毕竟已经习惯了Hbuil

????【Bug日记】UNI-APP POST请求发生500错误????问题描述最近在开发uni-app 微信小程序过程中，前后端交互时get请求可以正常访问，但是post请求服务器却返回500错误。错误描述见图：...

微信网页授权获取用户OpenID文章目录微信网页授权获取用户OpenID:pushpin:微信网页授权的前提:boom:网页授权域名配置:boom:前端获取Code前端拉起微信OAuth2.0授权解析codecode 注意事项:boom:后端根据code获取用户OpenID通过code换取网页授权根据access_tokena获取用户信息access_token注意事项:boom:详情以及错误信...

【????Bug日记】Element UI 动态设置表格高度部分表格不生效问题文章目录【:bug:Bug日记】Element UI 动态设置表格高度部分表格不生效问题:beetle: 问题描述:pushpin: 问题定位与问题原因:checkered_flag: 解决办法???? 问题描述       最近利用Element UI开...

【记一次粗心Bug】 Vue中使用getElementById结果返回元素为null ？文章目录【记一次粗心Bug】 Vue中使用getElementById结果返回元素为null ？在created()中使用getElementByIdmounted()中使用getElementByIdcreated()中结合this.$nextTick()实现业务需求总结首先，我在项目中用这样一个需求，...

使用TypeScrip开发Uni-App项目使用TypeScrip开发Uni-App项目通过HbuiderX创建uni-app项目常见装饰器的使用简单的Demo页面几个注意问题使用TypeScrip开发Uni-App项目通过HbuiderX创建uni-app项目在新项目的vue文件中使用内联ts<script lang="ts">按需引入vue装饰器import { Co...

uni-app项目非自定义组件模式升级到自定义组件模式问题总结最近更新了HBuiderX，发现原来的正常显示的页面和文件路径发生了异常，仔细一看原来是新更新的HX默认编译模式为自定义组件模式，和项目之前的非自定义组件模式产生了冲突和不兼容。正好也趁着这个机会将整个项目升级到自定义组件模式。非自定义组件模式升级到自定义组件模式，影响最直接的是组件内部的文件路径异常非自定义组件模式升级到自定义组...

uni-app通过canvas实现手写签名<template> <view > <view class="title">请在下面输入签名：</view> <canvas class="mycanvas" canvas-id="mycanvas" @touchstart="touchstart" @touchmove="touchmo...

安卓手机无法使用USB连接ApowerMirror投屏解决办法首先根据应用要求开启usb调试模式，usb连接设置为MTP（媒体传输）各个手机开启usb调试各有不同，自行百度步骤1配置好之后手机和PC端同时打开ApowerMirror切换到使用usb连接。如果步骤2在ＰＣ端能显示出你连接的手机，但是最后连接失败的话，那么你的情况可能和我的情况相同。－－＞安装了破解版的ApowerMirror...

uni-app自定义组件不能使用v-for解决办法原文：添加链接描述

promise 操作爬坑建立promise对象 /* *******************************扫码操作********************************* */ scanQRCode:function(){ let promise = new Promise(function(resolve,reject){ uni.scanCode...

uni-app以及微信小程序页面跳转后实现页面自动刷新在程序中需要从一个switch TAb页面跳转到另一个switch Tab页面，但是页面跳转之后，发现添转后的页面不会执行onload里面的刷新函数。这个时候就需要在程序里手动配置刷新，执行onload函数。思路通过getCurrentPages获取获取当前的页面栈，调用对应的方法，switchTab成功跳转后调用success，此时可以...

layer组件父子页面相互传递数据 layer 是一款功能强大的web弹出层组件，很多时候我们需要使用它弹出各种各样的信息 很多情况它都能胜任，比如简单的msg文本，tips提示，loading加载等。 但是对于功能更强大的弹出页面和iframe,在需要在父子页面之间传递数据的时候， 学习和使用起来就不是那么简单了。 本文主要记录了在使用layer组件进行父子传值时的一下方法和个...

Vue项目中如何引入外部js文件，并使用其中定义的函数一些常用的功能函数，我们希望将其封装起来放入一个外部JS文件中，好方便我们在需要的时候使用。vue可以使用import指令引入外部文件，但是作为新手，在使用过程中难免会导致很多错误，这里就将我遇到的一些问题做一下总结编写外部js文件这个比较简单，就正常将我们需要使用的功能函数安装js格式写入js文件即可需要注意的是，当我们希望在vue项...

LayUI 扩展插件dtree无法访问本地json数据填坑问题描述最近项目需要进行PC端后台管理开发，选择了LayuiAdmin后台管理模板，其中部门组织架构使用树形结构展示，这时在layui扩展插件里面看中了dtree插件。（主要是相对好看）集成到项目中的时候，调试的时候访问本地保存的json文件，报错找不到追定请求，请检查指定路径。问题排查文件路径检查一开始我以为是我文件路径指定错误...

#使用挂载全局变量跟踪无序navigate页面的跳转通常我们在使用uni.navigateto()函数时，希望页面能够逐级展开，并能逐级返回。但是有时候我们的页面打开顺序或者说优先级是同级的，这个时候如果一昧的使用navigateto()跳转，势必会使得我们在页面返回的时候造成返回混乱，如果每次跳转都采用关闭页面并打开新页面的方式，又会使得页面频繁与后端交互，增加页面负担。所有我希望能够记录页面...

#基于uni-app实现滚动上拉的多列复选列表前一篇文章，构建了一个复选列表，但是在实际过程中，列表项过多，导致展示区域很大。不得已改用多列滚动。将列表内容限制在height：500upx 的区域内。##实现的思路使用flex布局，使列表内的项横向布局（flex:row;）,给列表项设置好合适的宽度，使得页面一行放下三个列表元素。（当然也可以设置为其他宽带，以调整每一行放置的元素个数）。最...

uni-app使用canvas实现刮刮乐效果在uni-app中使用canvas比较简单，官方参考文档写的非常详细。但是uni-app使用canvas真的有很多坑，所有单独记录下自己的爬坑之旅。draw()方法uni-app设计 的draw()方法绘制canvas图像真的是非常的坑，绘制同一幅图像只能使用一次draw()方法，因此要实现擦除效果必须每次都擦除完然后再清楚原有的图像重新绘制新的图...

uni-animation动画操作记vue实现手风琴效果页面代码大致如下：<block v-for="(list,index) in HTTLists" :key="index"> <view class="HTT_box uni-list"> <view @click="spred(index)" style="display: flex;fl...

HBuiderX自定义代码块踩坑如何设置自定义代码块自定义代码块规则查看官方教程就好了官方教程走过的坑想在Vue文件中使用的代码块，需要设置在vue代码块中也就是在vue.json文件中编辑。其他的代码块同理。编辑在javascript.json中的代码块，只能在js文件或者js代码区域才能够执行。我一开始设置的时候，就是将想在vue文件中运行的代码块设置到了js代码块中，导致代码块...

微信小程序，uni-app阻止滚动事件或悬浮按钮拖动事件穿透（事件穿透）阻止滚动事件穿透的应用场景**【场景一】**在开发中遇到这样一个需求，在页面中添加一个仿苹果的拖动悬浮按钮，但是在长页面中，当拖动悬浮按钮时，长页面也会随之滚动。因此需要组织悬浮按钮上的touchmove事件穿透。**【场景二】**有时候我们需要在页面中弹出一个弹窗，在弹窗弹出后需要禁止原页面继续滚动。阻止滚动事件穿透...