2020年12月_柒仔不安

12月 10月 08月 06月 05月 02月

原创 uniapp局部上拉加载数据

一、页面局部实现上拉加载数据只有评论区可以上拉加载数据，网上找到了 vue-infinite-scroll二、使用官方示例1、 npm 加载依赖npm install vue-infinite-scroll --save2、单个页面引用import infiniteScroll from 'vue-infinite-scroll'export default { directives: { infiniteScroll }, data() { return { is

2020-12-16 17:18:44 2731 2

原创 uniapp下拉刷新上拉加载

一、需求留言板主页，显示所有的留言信息，带有分页功能；上拉加载数据，下拉刷新数据二、代码1、pages.json2、messageBoard.vue用了 uniapp 提供的组件： uni-load-more.vue<uni-load-more :status="loadingText" :contentText="contentText" ></uni-load-more>const loadingTextObj = { more: 'more', no

2020-12-16 17:03:41 1914

原创 uniapp单文件and多文件上传功能

一、上传文件功能前端上传后界面后，点击确定按钮，上传至后台。uniapp拍照上传功能二、代码<view class="top-nav-c"> <view class="before" @tap="isShowDoMessage = false">取消</view> 留言板 <view class="after" :class="{'submit-ck': isSubmit}" @tap="onSubmitMessageClick">确定&l

2020-12-16 16:42:49 1455

原创 uniapp拍照上传功能

一、需求留言板需求，上传留言时，可拍照或者上传图片二、调用拍照/上传文件功能点击拍照按钮，调取相机或者文件<view class="upload-img"> <image src="../../static/image/messageBoard/m_b_upload_btn.png" @tap="onGetImgClick"></image></view>data() { return { imageList:[], }},..

2020-12-16 16:25:45 7942 2

原创 uniapp预览图片

一、需求最近有一个留言板需求，留言之后需要展示留言信息，信息里面除了文字还有图片。点击图片，可预览图片。就用到了 uniapp 预览图片的功能：uni.previewImage(OBJECT)二、使用html<view class="img-c" v-show="item.pictureUrl"> <image class="img" v-for="(itemImg, imgIndex) in item.pictureUrl" :key="imgIndex" m

2020-12-16 15:57:27 3986

原创微信公众号授权H5页面

一、为何通过微信公众号授权官方:如果用户在微信客户端中访问第三方网页，公众号可以通过微信网页授权机制，来获取用户基本信息，进而实现业务逻辑。项目：使用 uniapp 开发的 H5 项目，需要通过公众号授权后，才能获取用户信息。PS：如果用 uniapp 开发小程序，可以走小程序的授权，这次用的 H5二、授权大致步骤1、网页授权回调域名在微信公众号请求用户网页授权之前，开发者需要先到公众平台官网中的“开发 - 接口权限 - 网页服务 - 网页帐号 - 网页授权获取用户基本信息”的配

2020-12-16 15:39:03 2647

原创 vue项目之前端生成二维码

一、前提刚开始是通过后台生成二维码并存放在云上的。后来公司的云，在获取到url后，图片不能及时的显示，需要等待几秒；之后，用了腾讯云解决的，在现在这个活动中，竟然出现线上空白的情况最终，选择前端生成二维码二、实现安装依赖包npm install vue-qr --saveHTML:<vue-qr class="vue-qr" :margin="0" :text="downloadData.link" colorDark="#000" colorLight="#fff" size=

2020-12-14 10:33:40 875

原创 uniapp小程序版发布后，报错（MiniProgramError Cannot read property ‘data‘ of undefined）

一、问题小程序上传后，打开页面，不能正常调用接口。通过真机模拟发现报错了，如下：二、解决调用接口时：直接把 baseUrl 写全了，不能通过配置项进行配置。原来的配置：现在：直接改 http 的 baseUrl...

2020-12-09 14:53:55 7388

原创 uniapp 分包--上传功能

一、问题通过HBuilder X-->发行-->小程序--微信(...)后，微信小程序提示上传失败。二、原因小程序上传项目大小限制为：单包2M 总包8M 三、解决uniapp 分包分包时遇到的问题： 1、安装 copy-webpack-plugin 时，提示 webpack 不存在，需要安装。调查后才知道，现在的项目是同事通过 HBuilderX 可视化界面创建的即没有package.json，也没有 webpack 配置。解决：项目工程互换，把原来的工程换位

2020-12-08 18:13:32 1100