uniapp跨端代码编写(h5和钉钉小程序)

news2024/11/16 11:48:28

页面开发

  1. 差异。小程序编译机制不一样,我在写h5的时候,页面布局啥的都是用uniapp的扩展组件来修改的(都是改的原生组件的样式),小程序编译有组件隔离,不能直接修改组件的原生样式,查了很多资料,都说降低hbuilderx的版本,去掉编译后文件的"styleIsolation": “apply-shared”,好像并没有啥作用;页面标签的编译差异,h5的template标签不会在浏览器中显示,小程序如果是slot的方式来使用的话会编译成一个view标签,在页面处理的时候需要对小程序进行单独处理。
    在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
2. 单位。页面的开发,在h5开发的时候,编写页面样式的时候我用的是px,然后将h5编译成小程序的时候页面就乱码了,后面看了一下官网文档,使用uniapp做多平台跨端应用的时候,用rpx来编写,在程序运行的时候,框架会自动转换对应的单位,适配不同的场景;编译后的单位是rem,rem相对HTML根元素,后续如果要做调整直接修改html的font-size大小就可以了;
3. 场景。在代码编写的时候,如果要使用一套代码,编译成不同的平台,可以通过if来做平台判断。

条件判断(适配不同的平台)

标签条件判断:
在这里插入图片描述
引包条件判断:
在这里插入图片描述
页面逻辑条件判断:
在这里插入图片描述
在这里插入图片描述
样式条件判断:
在这里插入图片描述

编译差异记录

具名插槽

代码:

<slot name="footer">
</slot>

h5:

 <template #footer>
 	里面的内容
 </template>

钉钉小程序:

 <view slot="footer">
 	里面的内容
 </template>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1717209.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Golang | Leetcode Golang题解之第120题三角形最小路径和

题目&#xff1a; 题解&#xff1a; func minimumTotal(triangle [][]int) int {n : len(triangle)f : make([]int, n)f[0] triangle[0][0]for i : 1; i < n; i {f[i] f[i - 1] triangle[i][i]for j : i - 1; j > 0; j-- {f[j] min(f[j - 1], f[j]) triangle[i][j]…

[RK3588-Andoird12] 关于LED灯控芯片is31fl3216和is31fl3236调试

问题描述 RK默认dts配置中并没有issi,is31fl32xx相关的配置指导。 is31fl3236是12X3 36路RGB is31fl3216是6X3 18路RGB 解决方案&#xff1a; is31fl3236 dts配置如下&#xff1a; &i2c1 {clock-frequency <400000>;status "okay";is31fl3236: led-co…

苏州金龙新V系客车科技助力“粤”动广州

粤动活力新V系&#xff01; 5月23日&#xff0c;苏州金龙新V系智慧客车推介会在羊城广州举行。活动现场展出了4款新V系代表车型&#xff0c;来自广东省旅游客运、道路运输行业的200余位从业者齐聚一堂&#xff0c;共同品鉴、体验了苏州金龙新V系产品的“新、心、芯”魅力。苏州…

接口设计的最佳实践-下篇

大多数程序员&#xff0c;做得最多的事&#xff0c;也不过是写接口这件事而已。 今天继续总结下接口设计需要注意的点。尽量每种都给出具体的场景、案例等&#xff0c;希望大家能有所收获。 1、接口幂等 幂等性&#xff1a;是指一个操作或者一个服务&#xff0c;无论执行多少…

GD32F470+lwip 丢包问题分析及解决

最近在用GD32和管理机之间用TCP协议开发一个功能&#xff0c;功能都没问题&#xff0c;后面跑大量发包时候的连续测试时&#xff0c;总是会出现偶发性的&#xff0c;大概几分钟到数十分钟的一次丢包。尽管在应用层做了超时机制&#xff0c;一旦超时就会重新建立socket链接并重新…

JavaScript的内存管理机制

No.内容链接1Openlayers 【入门教程】 - 【源代码示例300】 2Leaflet 【入门教程】 - 【源代码图文示例 150】 3Cesium 【入门教程】 - 【源代码图文示例200】 4MapboxGL【入门教程】 - 【源代码图文示例150】 5前端就业宝典 【面试题详细答案 1000】 文章目录 一、内存…

ubuntu离线安装kubesphere(包括docker、harbor)

这边使用虚拟机下载依赖配置环境以及模拟服务器各个节点&#xff0c;使用两个虚拟机模拟离线不联网环境的服务器&#xff0c;使用一个虚拟机联网下载依赖包&#xff0c;然后传入两个不能联网的虚拟机安装所有环境&#xff08;我这边偷懒就用两个虚拟机中的一个联网下载安装包。…

【M365运维】一个Bitlocker硬盘加密问题的处理

【问题】 新采购的电脑&#xff0c;出厂时已经有厂家做好了Autopilot的预配置&#xff0c;拿到手后根据标准流程完成系统的安装&#xff0c;却发现硬盘没有被Bitlocker加密。 表象&#xff1a; 1. 硬盘没有被加密的锁形图标&#xff1b; 2. 尝试手工启用Bitlocker, 出现组策略冲…

【二叉树】Leetcode 117. 填充每个节点的下一个右侧节点指针 II【中等】

填充每个节点的下一个右侧节点指针 II 给定一个二叉树&#xff1a; struct Node { int val; Node *left; Node *right; Node *next; } 填充它的每个 next 指针&#xff0c;让这个指针指向其下一个右侧节点。如果找不到下一个右侧节点&#xff0c;则将 next 指针设置为 NULL 。…

gpt-4o api申请开发部署应用:一篇全面的指南

利用 GPT-4o API 开发创新应用&#xff1a;一篇全面的指南 OpenAI 的 GPT-4o 是一款集成了音频、视觉和文本处理能力的多模态人工智能模型&#xff0c;它的出现代表了人工智能领域的重大进步。在本篇文章中&#xff0c;我们将详细介绍如何通过 OpenAI API 使用 GPT-4o&#xf…

linux centos nfs挂载两台服务器挂载统一磁盘目录权限问题

查看用户id id 用户名另一台为 修改uid和gid为相同id&#xff0c;添加附加组 usermod -u500 -Gwheel epms groupmod -g500 epms

RDD实战:排序算子 - sortBy()

在本实战案例中&#xff0c;我们将使用Apache Spark的sortBy()算子来对一个包含学生信息的RDD进行排序操作。 排序规则如下&#xff1a; 首先按照性别升序排列。在性别相同的情况下&#xff0c;按照年龄降序排列。 步骤1&#xff1a;创建学生信息列表 首先&#xff0c;我们创…

微服务架构-微服务架构的挑战与微服务化的具体时机

目录 一、微服务架构的挑战 1.1 概述 1.2 服务拆分 1.3 开发挑战 1.4 测试挑战 1.4.1 开箱即用、一键部署的集成环境 1.4.2 测试场景和测试确定性 1.4.3 微服务相关的非功能测试 1.4.4 自动化测试 1.5 运维挑战 1.5.1 监控 1.5.2 部署 1.5.3 问题追查 1.5.4 依赖管…

编辑任何场景! 3DitScene:通过语言引导的解耦 Gaussian Splatting开源来袭!

文章&#xff1a;https://arxiv.org/pdf/2405.18424 项目&#xff1a;https://zqh0253.github.io/3DitScene/ huggingface:https://huggingface.co/spaces/qihang/3Dit-Scene 场景图像编辑在娱乐、摄影和广告设计中至关重要。现有方法仅专注于2D个体对象或3D全局场景编辑&…

C++系列——————类和对象(上)

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 前言一、面向对象的三大特征二、类的引入2.1类的定义 三.类的访问限定符3.1访问限定符的介绍3.2.访问限定符的使用 四、类的作用域五、类的实例化六、类对象模型6.1…

oracle中的INTERVAL函数学习总结

Oracle 从9i数据库开始引入了一种新特性&#xff0c;可以用来存储时间间隔&#xff0c;出现了INTERVAL 函数。这个函数的表达式比较多&#xff0c;初学比较费劲不好掌握&#xff0c;经过以几个小时的查阅资料和实验&#xff0c;总结如下&#xff1a; interval year t…

基于离散小波变换(DWT)的心电信号伪影去除及心电信号PQRST波检测(MATLAB R2018)

心电信号是心脏神经&#xff0c;肌肉组织电化学活动的表现形式。这些电化学活动使心脏内部产生一系列非常协调的电刺激脉冲&#xff0c;分别使心房&#xff0c;心室的肌肉细胞兴奋&#xff0c;从而有节律的舒张和收缩。这些生物电活动在体表的不同部位形成不同的电位差变化&…

模型构建器之迭代器

上一篇我们介绍了模型构建器的基础&#xff0c;将一个工作流串联起来&#xff0c;然后做成模型工具。今天我们介绍模型构建器的第二个重要功能——迭代&#xff0c;也就是程序中的循环。 先来看一个例子。要给数据库中所有要素类添加一个相同的字段&#xff0c;该怎么做&#…

docker镜像体积优化攻略参考—— 筑梦之路

简单介绍 镜像的本质是镜像层和运行配置文件组成的压缩包&#xff0c;构建镜像是通过运行 Dockerfile 中的 RUN 、COPY 和 ADD 等指令生成镜像层和配置文件的过程。 和镜像体积大小有关的关键点&#xff1a; RUN、COPY 和 ADD 指令会在已有镜像层的基础上创建一个新的镜像层&…

黑马es集群

1、为什么要做es集群 单机的elasticsearch做数据存储&#xff0c;必然面临两个问题:海量数据存储问题、单点故障问题 海量数据存储问题:将索引库从逻辑上拆分为N个分片(shard)&#xff0c;存储到多个节点 单点故障问题:将分片数据在不同节点备份(replica) 2、搭建es集群 1、用…