uniapp开发app常见问题

2024-09-02

uni-app开发中的各种问题处理

特别注意: ※:在components下的组件,图片路径用 /static/img/back.png 这样的根路径形式,不要用../static 或者 ../../static 的形式,不然很坑,有些平台不报错也不显示,有些找不到路径. tips:防止弹窗遮罩时页面可滚动,在弹窗的外层view标签加上 @touchmove.stop.prevent="" 1.关于自定义导航栏中的刘海屏适配问题: 官方提供了一个CSS变量可以直接引用: var(--status-bar-height

选择了uniapp开发app

7月份打算做一简单app,之前公司做app的时候简单用过Dcloud公司的mui,当时由于uniapp刚出来,最终选择了mui.对uniapp的了解几乎没有. 做app对我来说几乎是零基础的,当然是能把任务完成越简单越好. 当时有了解谷歌的Flutter,是使用Dart语言开发的,由于我和另外同事都感觉入门门槛比较高,加上app开发时间比较着紧,所以放弃了.现Flutter更新的频率比较高,加上阿里大厂的扶持,后再做app会比较倾向. 本打算使用mui,当时是由于mui的性能问题一直也在犹豫,

多端开发之uniapp开发app

最近在给f做一些工具app,学习了不少关于uniapp编写android应用的知识. 首先,App应用的创建的时候要选择项目类型为uniapp类型.最开始我选择的是h5+项目,这种项目就比较容易写成纯js的项目,利用一些html5plus能力,或者使用mui来编写手机app. 我调研了一下,uniapp和h5+(mui为代表)的差异和优缺点如下所示. 技术类型优点缺点 uniapp 可以使用unipp封装的组件和api,有海量的插件可以从插件市场中找到.兼容多端,也可以用html5plus的

uni-app开发踩坑记录

大部分问题是我在h5端看不到而在android.iOS平台上暴露出来的,不包含小程序 1.:class="['defaultStyle', dynamicStyle]" 不支持直接这样写数组,需要在computed计算属性中手动拼接,如: :class="dynamicStyle" computed:{ dynamicStyle(){ return "defaultStyle red"; } } 2.:value="this.input

使用uni-app开发微信小程序

uni-app 开发微信小程序前言 9月份,开始开发微信小程序,也曾调研过wepy/mpvue,考虑到后期跨端的需求,最终选择使用了uni-app,本文主要介绍如何使用uni-app搭建小程序项目,以及自己对框架的补充,包括封装request接口,引用color-ui,动态设置底部tab页等,详情见下文 uni-app 介绍(官网) uni-app是一个使用Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS.Android.H5.以及各种小程序(微信/支付宝/百度/头条/

uni-app开发微信小程序引入UI组件库(Vant-weapp)步骤

uni-app开发微信小程序引入UI组件库(Vant-weapp)步骤这里以vant-weapp为例 uni-app官方文档介绍引入组件的方法 1. 新建相关目录根目录下创建 wxcomponents wxcomponents下新建vant目录创建完成后的目录结构 2. 项目中引入vant-weapp组件在vant-weapp的GitHub Releases版块下载最新的zip包解压下载文件,将dist目录拷贝到刚才创建vant目录中 3. 页面中使用引入的UI组件在App.Vue文

使用uniapp开发项目来的几点心得体会，供新手参考参考

先说一下提前须要会的技术要想快速入手uniapp的话,你最好提前学会vue.微信小程序开发,因为它几乎就是这两个东西的结合体,不然,你就只有慢慢研究吧. 为什么要选择uniapp??? 开发多个平台的时候,对,就是开发多端,其中包括安卓.IOS.H5/公众号.微信小程序.百度小程序...等其它小程序时,如果每个平台开发,人力开发成本高,后期维护也难,原生开发周期也长,那Unipp就是你的优先选择,官方是这样介绍的~哈~先来说一下uniapp的优点 uniapp优点优点一,多端支持当然是多端

uni-app 开发随笔（踩坑记录）

这里总结一些uni-app开发时我遇到的坑 uni-app获取元素高度及屏幕高度(uni-app不可使用document) uni.getSystemInfo({ success: function(res) { // res - 各种参数 console.log(res.windowHeight); // 屏幕的宽度 let info = uni.createSelectorQuery().select(".元素"); info.boundingClientRect(function

使用uView UI+UniApp开发微信小程序

在前面随笔的介绍中,我们已经为各种框架,已经准备了Web API.Winform端.Bootstrap-Vue的公司动态网站前端.Vue&Element的管理前端等内容,基本都是基于Web API基础的.完成这些基础准备和布局后,我们继续将技术的触角放到使用Vue语言开发小程序的场景中,本篇随笔介绍使用uView UI+UniApp开发微信小程序,介绍使用准备过程中的一些注意点和经验总结. 1.小程序的开发准备工作我们在开发小程序之前,需要了解一些基本的知识,以及掌握一些常规的开发工具,相关知

使用uView UI+UniApp开发微信小程序--判断用户是否登录并跳转

在<使用uView UI+UniApp开发微信小程序>的随笔中,介绍了基于uView UI+UniApp开发微信小程序的一些基础知识和准备工作,其中也大概介绍了一下基本的登录过程,本篇随笔详细介绍一下微信小程序的相关登录处理以及登录后设置用户身份信息,并跳转到相应页面的处理过程. 1.令牌判断和登录方式在之前介绍过,在业务系统中,我们需要根据登录用户的身份获取对应的数据,如果用户没有登录,这些信息是无法获到的,那么我们可以在app.vue中判断用户是否登录,然后跳转到对应的页面,如下所示.

【uniapp 开发】uni-app 中如何打开外部应用

我们在开发 App 应用中,经常会遇到打开第三方程序的场景,比如打开手机淘宝.通过第三方浏览器打开一个 url 等等. App不像网页可以使用http超链接互相跳转,但手机os设计了scheme机制,可以通过特殊的链接互相调起. 比如手机淘宝,其安装后会在手机os中会注册一个scheme协议,taobao://. 这种协议还支持参数,比如taobao://s.taobao.com/search?q=uni-app启动淘宝并打开搜索页面搜索uni-app. 在uni-app/5+App中,可以通过

MUI开发APP，scroll组件，运用到区域滚动

最近在开发APP的过程中,遇到一个问题,就是内容有一个固定的头部和底部. 头部就是我们常用的header了,底部的话,就放置一个button,用来提交页面数据或者进入下一个页面等,效果如下: 这里面需要注意到的地方就是,头和底是固定的,但是中间的部分呢,由于要设置24小时的内容,从图中可以看到,只显示了03:00~13:00的内容,剩下的内容没显示出来.这里面,我们就需要用到区域滚动了,就是保持头和底不动,中间滚动,所以,我们就要用到MUI的scorll组件,根据MUI官网的介绍

APICloud开发App总结(一)

apiCloud app 开发是最近一两年刚刚兴起的一种混合开发方式.常用的模块以原生方式开发好,然后用js进行粘合.组织,完成整个的app的逻辑.这种开发方式极大的提高了软件模块的复用率,加快了app开发速度,将app开发人员的精力集中到核心业务逻辑上,是一种非常合理的软件开发思路.这样,整个app开发的重心移到了界面的设计与布局上,即主要用web前端技术设计实现app的界面.反而是用js调用模块并实现业务逻辑这部分工作相比较轻松. 这样一来,用这种方式开发app的关键一环就在于界面部分的

如何优雅的使用vue+vux开发app -03

如何优雅的使用vue+vux开发app -03 还是一个错误的示范,但是离优雅差的不远了... <!DOCTYPE html> <html> <head> <title>vue-vux</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

如何优雅的使用vue+vux开发app -02

如何优雅的使用vue+vux开发app -02 很明显这又是一个错误的示范,请勿模仿使用动态组件实现保留状态的路由 <!DOCTYPE html> <html> <head> <title>vue-vux</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <!--include Vux

如何优雅的使用vue+vux开发app -01

如何优雅的使用vue+vux开发app -01 很明显下面是个错误的示范: <!DOCTYPE html> <html> <head> <title>vue-vux</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  <link

《PHP开发APP接口》笔记

PHP开发APP接口 [TOC] 课程地址 imooc PHP开发APP接口学习要点 APP接口简介封装通信接口方法核心技术 APP接口实例服务器端 -> 数据库|缓存 -> 调用接口 -> 客户端 APP接口简介 APP接口介绍 APP如何进行通信通信格式区别 APP接口做的哪些事儿 APP接口介绍概念 PHP面向对象的接口(interface)与APP中的接口(API)概念区别: interface是一种特殊的抽象类,只定义一系列抽象方法. // 定义一个接口 inter

Web程序员开发App系列 - 开发我的第一个App，源码下载

Web程序员开发App系列 Web程序员开发App系列 - 认识HBuilder Web程序员开发App系列 - 申请苹果开发者账号 Web程序员开发App系列 - 调试Android和iOS手机代码 Web程序员开发App系列 - 开发我的第一个App 待续目录前言源码和App下载准备工作查看留言页面增加留言页面前言看了前面几篇文章后我们终于要开始敲代码了,由于所有前端代码都是Html静态问题,所以你用什么开发工具都可以,后台我采用MVC开发,因为Html静态文件需要打包,里面

Web程序员开发App系列 - 调试Android和IOS手机代码（补图）

Web程序员开发App系列 Web程序员开发App系列 - 认识HBuilder Web程序员开发App系列 - 申请苹果开发者账号 Web程序员开发App系列 - 调试Android和iOS手机代码 Web程序员开发App系列 - 开发我的第一个App 待续目录前言调试Android代码调试iOS代码准备开发App 前言在App中代码如果需要调试,就需要借助Chrome调试Android和Safari调试iOS手机,由于编写的都是Html代码,所以等下看到的界面都非常熟悉,对于We

Web程序员开发App系列 - 申请苹果开发者账号

Web程序员开发App系列 Web程序员开发App系列 - 认识HBuilder Web程序员开发App系列 - 申请苹果开发者账号 Web程序员开发App系列 - 调试Android和iOS手机代码 Web程序员开发App系列 - 开发我的第一个App 待续目录前言企业开发者和公司开发者的区别开发者账号申请流程申请打包的相关证书将ipa文件发布到AppStore 第一次发布失败的经历前言为什么第二篇文章要讲如何申请苹果证书呢?因为没有苹果证书你开发的App就没办法在苹果设备上运

Web程序员开发App系列 - 认识HBuilder

Web程序员开发App系列 Web程序员开发App系列 - 认识HBuilder Web程序员开发App系列 - 申请苹果开发者账号 Web程序员开发App系列 - 调试Android和iOS手机代码 Web程序员开发App系列 - 开发我的第一个App 待续目录前言什么是HBuilder 准备工作我的第一个App 配置源代码管理前言好久没写博客啦,2年前进入一个创业型公司,由于太忙,再加上家里有又多了个小宝贝,一直没时间写博客,现在待的公司虽然人不多,但有几位技术牛人,而且我自己在

uniapp开发app常见问题

热门专题