uni-app深入学习之模板运用【day4】

简介: uni-app深入学习之模板运用【day4】

在这里插入图片描述

去掉滚动条

以前没有做过很多的项目都没有涉及到滚动条的处理。我刚刚看到这也让人耳目一新。它还可以处理滚动条。当然,编码吧。

.scroll-box ::-webkit-scrollbar{
    width: 0 !important;
    display: none;
    height: 0 !important;
    -webkit-appearance : none;
    background : transparent;
}

uni app的标记与applet和HTML的标记不同。例如,div应更改为view,span应更改为text,a应更改为navigator。

好看的板子,评价模板

了解动画的用法,如下:

image.active{
    animation: star_move ease-in 1 1s,star_rotate ease 1.5s infinite 1s;
}

@keyframes star_move{
        from{
            width: 50upx;
            height: 50upx;
            transform: rotate(180deg)
        }
        to{
            width: 32upx;
            height: 32upx;
            transform: rotate(0)
        }
    }
    @keyframes star_rotate{
        0%{
            transform: rotateY(360deg)
        }
        100%{
            transform: rotateY(180deg)
        }
    }

运行结果如图所示:
在这里插入图片描述

request 请求

我们使用uni app的请求

uni.request({
    url: 'https://www.example.com/request', //仅为示例,并非真实接口地址 
    data: {
        text: 'uni.request'
    },
    header: {
        'custom-header': 'hello' //自定义请求头信息
    },
    success: (res) => {
        console.log(res.data);
        this.text = 'request success';
    }
});

你发现有什么不同吗?因此,除前缀Wx替换为uni外,其他要求与原规范一致。Uni app将最大程度地消除不同applet平台之间的差异。

跨端

虽然是交叉端,但一定有一些情况不受支持。例如,如果遇到一些特定于平台的API,我应该怎么做?
别担心。Uni-app考虑了这些问题,即使用条件编译。

条件编译

在C语言中,通过\ifdef和\ifndef,为不同的操作系统(如windows和MAC)编译不同的代码。uni-app参考的思想为uni-app提供了一种有条件的编译手段,很好地完成了平台在项目中的个性化实现。
通过使用注释实现条件编译。注释以不同的语法编写。JS使用//注释,CSS使用/注释/,vue/nvue模板使用`。
平台特有的API实现:
表示只有 h5 不使用这个 api

uni.createAnimation(OBJECT)

注意:
对于非H5端,不能使用浏览器自己的对象,如文档、窗口、本地存储、cookies等,也不能使用jQuery和其他依赖于这些浏览器对象的框架。因为任何小程序都不支持这些对象。没有这些浏览器内置对象,业务发展不会受到影响。uni提供的API足以完成业务。

相关文章
|
Java 数据库 Android开发
0003Java安卓程序设计-springboot基于Android的学习生活交流APP
0003Java安卓程序设计-springboot基于Android的学习生活交流APP
69 0
|
11天前
|
缓存 移动开发 小程序
uni-vue3-wetrip自创跨三端(H5+小程序+App)酒店预订app系统模板
vue3-uni-wetrip原创基于vite5+vue3+uniapp+pinia2+uni-ui等技术开发的仿去哪儿/携程预约酒店客房app系统。实现首页酒店展示、预订搜索、列表/详情、订单、聊天消息、我的等模块。支持编译H5+小程序+App端。
48 8
|
5月前
|
小程序 前端开发
生活商城app微信小程序模板源码
生活商城app微信小程序模板源码
65 6
|
5月前
|
小程序 前端开发
汽车报价资讯app小程序模板源码
汽车报价资讯app小程序模板源码
44 4
|
4月前
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
116 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
5月前
|
小程序 前端开发
仿哔哩哔哩视频app小程序模板源码
仿哔哩哔哩视频app小程序模板源码
225 5
仿哔哩哔哩视频app小程序模板源码
|
4月前
|
JavaScript Java Python
【Azure 应用服务】在Azure App Service for Windows 中部署Java/NodeJS/Python项目时,web.config的配置模板内容
【Azure 应用服务】在Azure App Service for Windows 中部署Java/NodeJS/Python项目时,web.config的配置模板内容
|
5月前
|
小程序 定位技术
预约停车位app小程序模板
简单的手机预约停车位,在线停车位,预约停车管理小程序页面模板。包含:主页、预约停车、预约管理、地图导航等。
125 0
|
5月前
|
小程序 前端开发
商家团购app微信小程序模板
手机微信商家团购小程序页面,商家订餐外卖小程序前端模板下载。包含:团购主页、购物车订餐页面、我的订单、个人主页等。
43 0
|
7月前
|
监控 安全 Shell
深入探究App压力测试的关键要点:从零开始学习Monkey
Monkey是Google的自动化测试工具,用于模拟用户随机事件以测试应用的稳定性和压力。它可以在模拟器或设备上运行,通过随机点击发现潜在问题。

热门文章

最新文章

下一篇
DataWorks