Uni-App基本使用方法

简介: Uni-App基本使用方法

配置环境

image.png

创建一个新页面的步骤

  1. 在pages文件夹下建立一个和index相似的文件夹
  2. 增加json内容,注意修改路径,下面的这两个,谁在前面谁是首页。

image.png

样式和sass

  • 小程序中的750rpx等于屏幕宽度
  • 100vw 等于屏幕的宽度
  • 100vh == 屏幕的宽度

安装sass依赖

  1. cnpm i node-sass sass-loader
    第二步:修改下面的style

image.png

相关文章
|
JavaScript 数据库
uni-app的多环境部署配置
分享下如何对uni-app项目进行多环境打包部署改造
2243 0
|
1月前
|
缓存 开发框架 移动开发
uni-app:下载使用uni&创建项目&和小程序链接&数据缓存&小程序打包 (一)
uni-app 是一个跨平台的开发框架,它允许开发者使用 Vue.js 来构建应用程序,并能够同时发布到多个平台,如微信小程序、支付宝小程序、H5、App(通过DCloud的打包服务)等。uni-app 的目标是通过统一的代码库,简化多平台开发过程,提高开发效率。 在这一部分中,我们将逐步介绍如何下载和使用uni-app、创建一个新的项目、如何将项目链接到小程序,以及实现数据缓存的基本方法。
|
6月前
|
安全 定位技术
ENVI软件App Store插件工具的下载、安装与使用方法
ENVI软件App Store插件工具的下载、安装与使用方法
352 1
|
消息中间件 存储 移动开发
【消息中间件】原生PHP对接Uni H5、APP、微信小程序实时通讯消息服务
【消息中间件】原生PHP对接Uni H5、APP、微信小程序实时通讯消息服务
167 0
uni-app 事件传值 | this.$emit、uni.$emit 区分
uni-app 事件传值 | this.$emit、uni.$emit 区分
483 0
|
存储 缓存 API
uni-app 的 storage 数据缓存
uni-app中使用storage进行 数据缓存
|
JSON 前端开发 API
使用uni-app封装request
封装request请求
468 0
|
移动开发 开发框架 JavaScript
uni-app 与 Vue H5 项目通讯
uni-app 与 Vue H5 混合开发app的通讯方法
3335 0
uni-app 与 Vue H5 项目通讯
|
数据安全/隐私保护
uni-app 中保持用户登录状态
在应用中保持登录状态是一个应用常见的需求,本文简单介绍下在 uni-app 中如何保存用户登录状态。 简介 uni-app 中不支持读写 cookie,所以不能如传统的应用那样通过读取 cookie 来判断是否是登录状态。
13195 0
uni-app导航栏自定义配置|仿App原生导航条
uniapp自带的原生导航条能满足一般项目需求,但是对于一些复杂导航栏,如:京东、淘宝、微信顶部导航,这时就需要进行自定义配置了。基于uniapp实现的自定义仿微信导航栏uni_headerBar,支持背景渐变、标题居左/居中、搜索条、按钮支持文字/字体图标/图片 uniApp原生导航栏 uni-app原生导航栏也能实现一些顶部自定义按钮+搜索框,只需在page.json里面做一些配置即可。
4763 0
下一篇
无影云桌面