uni-app,uni-app开发教程,uni-app知识系列问题

uni-app微信小程序实现发送验证码+倒计时功能

2024-10-20

一、效果展示：用户输入手机号，验证手机号是否正确，正确发送验证码，校验验证码。二、uniapp前端界面代码<template> <view class="fixed_menban"> <view class="fixed_c"> <view class="colse" @click="colse"> <image src="../../static/colse.png" ></image> </view> <view class="link"> <view class="left_phone"> <image src="../../static/phone.png" ></image> </view> <view class="center_link"> <image src=".

一个uniapp微信小程序图片裁剪工具插件invinbg-image-cropper推荐

2024-08-16

1583 0

一、需求分析在做uniapp开发的时候，做图片上传，需要对用户上传的图片进行裁剪后，再上传图片，然后给到用户自己去裁剪图片。二、插件截图三、功能描述用户点击上传图片，可以对其进行裁剪，旋转，编辑，放大缩小四、插件下载微信扫描下方，二维码关注公众号，回复"图片裁剪"，详细操作，请看图片五、插件使用方法1、下载好插件，放到组件目录 components 目录下，没有 components 目录的话就新建目录，如下图：2、放置上传图片按钮<button size='primary' lang="zh_CN" @click="onChooseFile" class="btn3">上传图片</button&g

uniapp实现滑动指定位置显示顶部导航

2024-03-22

1519 0

uniapp实现滑动指定位置显示顶部导航，通过监听页面滚动位置，进行判断是否展示，是的话就增加class名称on1、在顶部导航加入配置： :scroll-top="scrollTop" 和 scroll="onPageScroll"<template>  <view class="container" :scroll-top="scrollTop" scroll="onPageScroll"> <view :class="!showNavbar ? 'home_head' : 'home_head on'"> <view class="home_head_search"> <image src="../../static/home_head_search.png"></image> <view class="">想搜点什么

uniapp微信小程序如何自定义底部tabbar导航

2024-03-22

2573 0

微信小程序默认的tabbar不是很好看，我们可以自自定义底部导航，自定义样式，以下是个uniapp案例demo，供大家参考和使用：一、创建components组件tabbar.vue二、编写底部导航<template>  <view class="tabbar" :style="{'padding-bottom': paddingBottomHeight + 'rpx'}"> <view class="tabbar-item" v-for="(item, index) in list" :key="index" @click="tabbarChange(item.path)"> <view class="column-me row-center tabbarActive" v-if="current == item.id"> <view :c

uni-app实现视频组件播放和暂停

2023-08-27

2478 0

前端获取视频id，使用pause()，play()方法控制视频播放和暂停。1、前端代码：<template> <view class="video"> <video id="videoId" :src="detail.resDetail.playUrl" autoplay='true' enable-play-gesture='true' controls='true' objectFit="cover" @fullscreenchange='fullscreenchange' play-strategy='2'></video> </view> <view @tap="play" v-if="isPlaying"> <image src="../../static/pasue.png" mode="widthFix"></image> <text>暂停</text> </view&

uni-app如何实现点击按钮全屏播放视频

2023-08-27

3014 0

在做电视端APP的时候，我们需要使用到点击按钮，实现全屏播放视频，我们可以使用以下方法来实现：1、前端模板代码<template> <view class="content"> <view class="videocontent"> <view class="video"> <video id="videoId" :src="detail.resDetail.playUrl" autoplay='true' enable-play-gesture='true' controls='true' objectFit="cover" @fullscreenchange='fullscreenchange' play-strategy='2'></video> </view> </view> </view> </template

解决uni-app打包安卓app在平板或分辨率高的模拟器下不宽屏显示问题

2023-08-25

2631 0

在使用uni-app的时候，遇到一个情况就是uni-app打包安卓app在平板或分辨率高的模拟器下不宽屏显示问题，解决方法如下：加入如下代码即可"screenOrientation" : [ ;;;;;;"portrait-primary", ;;;;;;"landscape-primary", ;;;;;;"portrait-secondary", ;;;;;;"landscape-secondary" ;;;;], 打开源码视图，如下图：

uni-app如何生成安卓证书，使用jdk生自有证书方法

2023-08-25

1600 0

uni-app生成安卓证书，用于打包安卓APP，以下是生成的方法，供大家参考：1、前提条件，安装jdk1.8：https://xiazai.zol.com.cn/detail/53/529719.shtml2、使用java jdk打包证书，Win+R 进入cmd命令终端cmd C:\Program Files\Java\jdk1.8.0_331\bin 3、执行生成安装证书命令keytool -genkey -alias testalias -keyalg RSA -keysize 2048 -validity 36500 -keystore C:\Users/Hm/test.keystore 这里的C:\Users/Hm/为本地电脑存放证书路径，可以更改为自己的。4、回车后会提示：Enter keystore password:;//输入证书文件密码，输入完成回车;;

解决uniapp下载视频，使用uni.downloadFile下载大文件会出现下载到一半就停止问题

2023-08-06

5429 0

uni.uploadFile(OBJECT)将本地资源上传到开发者服务器，客户端发起一个 POST 请求，其中 content-type 为 multipart/form-data。如页面通过 uni.chooseImage 等接口获取到一个本地资源的临时文件路径后，可通过此接口将本地资源上传到指定服务器。1、问题描述：在使用这个uni-app这个文件下载接口的时候，发现下载到一半就停止下载，经过打印显示下载超时报错为：errMsg: "downloadFile:fail timeout"，可以看出示下载超时。后面看了文档有个参数：timeout，改参数不是必须填写的。timeout Number 否超时时间，单位 ms2、解决方法：我们

uni-app设置是否保持常亮状态，离开小程序后设置失效

2023-08-06

1922 0

uni-app设置是否保持常亮状态，离开小程序后设置失效// 保持屏幕常亮 uni.setKeepScreenOn({ keepScreenOn: true }); 参数说明：keepScreenOn Boolean 是是否保持屏幕常亮success Function 否接口调用成功的回调fail Function 否接口调用失败的回调函数complete Function 否接口调用结束的回调函数（调用成功、失败都会执行）

uniapp打包app提示通讯录权限问题，如何取消通讯录权限

2022-10-01

9129 0

HBuilderX使用云打包时提示：通讯权限问题，需要重新实名认证。云端服务器返回错误:本次打包选择了通讯录权限,请登录开发者中心(https://dev.dcloud.net.cn)完成实名认证后再继续打包!如不需要使用通讯录权限,请在manifest.json页面取消通讯录权限后,重新提交打包。通讯录权限配置: 1.App模块配置: Contact(通讯录): 2. App权限配置:android.permission.READ_CONTACTS由于项目中不需要用到通讯录权限，所以需要取消通讯录权限

Uniapp如何引入自定义样式文件

2022-02-23

3173 0

首先我们在项目根目录下创建目录并创建我们的css文件common.css打开项目下的App.vue文件，添加如下代码，引入我们的自定义的样式css文件<style lang=”scss”> @important “common/common.css” </style>

uniapp下微信小程序报错TypeError: Cannot read property 'forceUpdate' of undefine

2022-02-14

6805 0

uniapp下微信小程序报错TypeError: Cannot read property 'forceUpdate' of undefine解决方法出现这个问题是因为uniapp项目里面没有配置好小程序appid，我们打开项目下的manifest.json文件，添加下小程序appid即可

uniapp小程序实现登录授权获取用户信息

2021-12-30

3913 0

登录授权获取用户信息，本文使用的新版的登录授权接口，结合后端ThinkPHP6框架实现1、放置授权登录按钮<template> <view class="userinfo" v-if="userInfo !=''"> <view class="userimg"> <image :src="userInfo.avatar" mode=""></image> </view> <view class="nickName"> {{userInfo.nickName}} </view> </view> <view class="userinfo" v-else> <view class="userimg"> <image src="../../static/tx.png" mode=""></image> &l

uniapp微信小程序更新版本提示

2021-12-30

2460 0

uniapp实现更新是用户打开显示版本更新提示打开app.vue文件夹，在onLaunch方法下加入如下代码const updateManager = uni.getUpdateManager() updateManager.onCheckForUpdate(function (res) { ;// 请求完新版本信息的回调 console.log(res.hasUpdate) }) // 下载新版本 updateManager.onUpdateReady(function () { uni.showModal({ title: '更新提示', content: '新版本已经准备好，是否重启应用？', success(res) { if (res.confirm) { // 重启应用 updateManager.applyUpdate() } } }) }) // 新版本下载

uniapp判断平台场景

2021-05-16

2962 0

开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉/淘宝）、快应用等多个平台。在开发项目过程中，有时想判断平台如何判断呢？平台判断有2种场景，一种是在编译期判断，一种是在运行期判断。编译期判断;编译期判断，即条件编译，不同平台在编译出包后已经是不同的代码。//;#ifdef;H5; alert("只有h5平台才有alert方法") //;#endif 如上代码只会编译到H5的发行包里，其他平台的包不会包含如上代码。运行期判断;运行期判断是指代码已经打入包中，仍然需要在运行期判断平台，此时可

uniapp预编译器错误：代码使用了scss/sass语言，但未安装相应的编译器插件，请前往插件市场安装该插件:

2021-05-15

4551 0

20:49:47.904 开始差量编译...20:49:48.601 预编译器错误：代码使用了scss/sass语言，但未安装相应的编译器插件，请前往插件市场安装该插件:20:49:48.611 https://ext.dcloud.net.cn/plugin?name=compile-node-sass at components\yy-video-player\yy-video-player.nvue:120:49:48.613 文件查找失败：'@./util/yy-video-player.nvue' at main.js:5引入一个视频播放插件，报上面的错误。导致出现上述现象的原因是未安装相关编译器。解决方法：1、打开HBuilderX，点击工具选项，然后点击插件安装2、切换到安装新的插件，前往插件市场安装3、

uniapp通过设置navigationStyle隐藏头部导航

2021-05-05

6321 0

navigationStyle导航栏样式，仅支持 default/custom。custom即取消默认的原生导航栏{ "pages":;[;//pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages { "path":;"pages/index/index", "style":;{ "navigationBarTitleText":;"", "backgroundColor":"#4CD964" } } ], "globalStyle":;{ "navigationBarTextStyle":;"black", "navigationBarTitleText":;"uni-app", "navigationBarBackgroundColor":;"#F8F8F8", "backgroundColor":;"#F8F8F8", "navigationStyle":;"cu

uniapp全局背景颜色设置方法

2021-05-05

5660 0

uni-app 有一个全局背景色设置方法在根目录的 App.vue 文件里的 style 块中添加代码即可<style> /*每个页面公共css;*/ page{ background-image:;linear-gradient(to;bottom;right,;#0d2227;,;#2d5063);; } </style>

uniapp小程序路由与跳转页面的几种方法收藏

2021-01-22

3326 0

以下收藏了uniapp小程序的5种路由与页面跳转方法，供大家参考。1、uni.navigateTo(OBJECT)：保留当前页面，跳转到应用内的某个页面，使用uni.navigateBack可以返回到原页面。示例：//在起始页面跳转到test.vue页面并传递参数 uni.navigateTo({ ;;;;url:;'test?id=1&name=uniapp' });2、uni.redirectTo(OBJECT)：关闭当前页面，跳转到应用内的某个页面。示例：uni.redirectTo({ ;;;;url:;'test?id=1' });3、uni.reLaunch(OBJECT)：关闭所有页面，打开到应用内的某个页面。示例：uni.reLaunch({ ;;;;url:;'te

uniapp实现跳转到其他微信小程序方法

2021-01-21

6662 0

小程序跳转到其他小程序主要用到uni.navigateToMiniProgram（{}）方法，模板页面里面放置点击方法。<template> ;;;;;;;;;<view> ;;;;;;;;;;;;;;;;;;;<view;@click="getUrl('wx8235re9af079b91','pages/index/index')">简忆知音</view> ;;;;;;;;;</view> </template>这里写了一个方法，通过传递小程序appid和首页地址，来实现跳转<script> export;default;{ ;;;;;;;;;methods:;{ ;;//;小程序跳转 ;;;;;;;;;;;getUrl(appId,path){ ;;;;;;;;;;;;;;;;;;;;;uni.

uni-app微信小程序实现发送验证码+倒计时功能

一个uniapp微信小程序图片裁剪工具插件invinbg-image-cropper推荐

uniapp实现滑动指定位置显示顶部导航

uniapp微信小程序如何自定义底部tabbar导航

uni-app实现视频组件播放和暂停

uni-app如何实现点击按钮全屏播放视频

解决uni-app打包安卓app在平板或分辨率高的模拟器下不宽屏显示问题

uni-app如何生成安卓证书，使用jdk生自有证书方法

解决uniapp下载视频，使用uni.downloadFile下载大文件会出现下载到一半就停止问题

uni-app设置是否保持常亮状态，离开小程序后设置失效

uniapp打包app提示通讯录权限问题，如何取消通讯录权限

Uniapp如何引入自定义样式文件

uniapp下微信小程序报错TypeError: Cannot read property 'forceUpdate' of undefine

uniapp小程序实现登录授权获取用户信息

uniapp微信小程序更新版本提示

uniapp判断平台场景

uniapp预编译器错误：代码使用了scss/sass语言，但未安装相应的编译器插件，请前往插件市场安装该插件:

uniapp通过设置navigationStyle隐藏头部导航

uniapp全局背景颜色设置方法

uniapp小程序路由与跳转页面的几种方法收藏

uniapp实现跳转到其他微信小程序方法

置顶推荐

代码版本管理工具Git常用命令操作

html前端按钮效果

swiper插件的使用

管理服务器常见的几个命令

标签云

浏览排行

最近热文

打赏本站

如果你觉得本站很棒，可以通过扫码支付打赏哦！

微信扫码：你说多少就多少~

支付宝扫码：你说多少就多少~

友情链接

关于简忆

官方公众号

官方小程序

技术闲聊

架构统计

uni-app微信小程序实现发送验证码+倒计时功能

一个uniapp微信小程序图片裁剪工具插件invinbg-image-cropper推荐

uniapp实现滑动指定位置显示顶部导航

uniapp微信小程序如何自定义底部tabbar导航

uni-app实现视频组件播放和暂停

uni-app如何实现点击按钮全屏播放视频

解决uni-app打包安卓app在平板或分辨率高的模拟器下不宽屏显示问题

uni-app如何生成安卓证书，使用jdk生自有证书方法

解决uniapp下载视频，使用uni.downloadFile下载大文件会出现下载到一半就停止问题

uni-app设置是否保持常亮状态，离开小程序后设置失效

uniapp打包app提示通讯录权限问题，如何取消通讯录权限

Uniapp如何引入自定义样式文件

uniapp下微信小程序报错TypeError: Cannot read property 'forceUpdate' of undefine

uniapp小程序实现登录授权获取用户信息

uniapp微信小程序更新版本提示

uniapp判断平台场景

uniapp预编译器错误：代码使用了scss/sass语言，但未安装相应的编译器插件，请前往插件市场安装该插件:

uniapp通过设置navigationStyle隐藏头部导航

uniapp全局背景颜色设置方法

uniapp小程序路由与跳转页面的几种方法收藏

uniapp实现跳转到其他微信小程序方法

置顶推荐

代码版本管理工具Git常用命令操作

html前端按钮效果

swiper插件的使用

管理服务器常见的几个命令

标签云

浏览排行

最近热文

打赏本站

如果你觉得本站很棒，可以通过扫码支付打赏哦！

微信扫码：你说多少就多少~

支付宝扫码：你说多少就多少~

友情链接

关于简忆

官方公众号

官方小程序

技术闲聊

架构统计

使用以下账号登录