uniapp条件判断app,H5,微信小程序端

已于 2022-08-01 17:51:26 修改
阅读量1.1w 收藏 57
点赞数 19
文章标签： 微信小程序 小程序 前端
于 2022-08-01 17:21:19 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_58849641/article/details/126105475
版权

1.CSS里面判断不同的端

APP：APP端

            /*#ifdef APP-PLUS*/
            top:0;
            /*#endif*/

H5：H5端
            /*#ifdef H5*/
            top:88rpx;
            /*#endif*/

MP：小程序
            /*#ifdef MP*/
            top:0;
            /*#endif*/

2.JS里面判断不同的端

APP：APP端

            /*#ifdef APP-PLUS*/
            console.log('APP端')
            /*#endif*/

H5：H5端
            /*#ifdef H5*/
            console.log('H5端')
            /*#endif*/

MP：小程序
            /*#ifdef MP*/
            console.log('微信小程序端')
            /*#endif*/

3.在页面上判断不同的端

APP：APP端

            <!-- #ifdef APP-PLUS -->
            <view> APP端 </view>
            <!-- #endif -->

H5：H5端
            <!-- #ifdef H5 -->
            <view> H5端 </view>
            <!-- #endif -->

MP：小程序
           <!-- #ifdef MP -->
            <view> 小程序端 </view>
            <!-- #endif -->

许你满眼星辰
关注
  • 19
    点赞
  • 踩
  • 57
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
uni-app 的条件编译（APP-PLUS 、H5、MP-WEIXIN ）
qq_41988669的博客
09-06 2373
条件编译是用特殊的注释作为标记，在编译时根据这些特殊的注释，将注释里面的代码编译到不同平台。写法：以 #ifdef 或 #ifndef 加 %PLATFORM% 开头，以 #endif 结尾。1 #ifdef：if defined 仅在某平台存在 2 #ifndef：if not defined 除了某平台均存在 3 %PLATFORM%：平台名称
2021-09-25 uniapp的条件编译，用于各种兼容的问题解决（文图详解）
weixin_45721912的博客
09-25 3503
1. 由于UNIAPP 是一套代码多个平台都可以使用，所以就有些兼容问题要处理。有些代码小程序是没有问题，但是到了H5或者是APP 就无法使用的问题。 2.这些问题呢，UNIAPP有一个API 的条件编译可以解决，就跟VUE的if else一样简单方便，可以解决大部分的兼容问题，接下来就给大家详细的列举一下 并告诉怎么使用。 3.使用方法和类型 3.1下面的样式是在js中使用 // #ifdef APP-PLUS 此代码只在APP中出现 // #endif // #ifdef H5 此代码
uniapp条件编译使用教学(#ifdef、#ifndef)
最新发布
m0_38007556的博客
06-27 614
条件编译是用特殊的注释作为标记，在编译时根据这些特殊的注释，将注释里面的代码编译 到不同平台。#ifndef APP-PLUS————除了APP不显示，其他的都显示。#ifdef APP-PLUS————只在APP显示。
uni-app 学习笔记
fmk1023的博客
09-27 3785
文章目录1. uni-app 基础1.1 什么是uni-app1.2 uni-app的优点 1. uni-app 基础 官方文档 1.1 什么是uni-app uni-app是一个使用Vue.js语法来开发所有前端应用的框架（也称之为全端开发框架） 开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/QQ/快手/钉钉/淘宝）、快应用等多个平台。 技术栈：JavaScript，vue， 微信小程序， uni-app 1.2 uni-app的优点
uin-app 的条件编译（APP-PLUS 、H5、MP-WEIXIN ）
热门推荐
leoly612200的博客
07-29 1万+
一、条件编译 条件编译是用特殊的注释作为标记，在编译时根据这些特殊的注释，将注释里面的代码编译到不同平台。 写法：以 #ifdef 或 #ifndef 加 %PLATFORM% 开头，以 #endif 结尾。 1 #ifdef：if defined 仅在某平台存在 2 #ifndef：if not defined 除了某平台均存在 3 %PLATFORM%：平台名称 条件编译写法 说明 #ifdef APP-PLUS 需条件编译的...
基于uniapp微信小程序我的钱包页面
03-26
而uniapp作为一款跨平台开发框架，能够帮助开发者快速构建H5、微信小程序、支付宝小程序等多个平台的应用。本教程将深入探讨如何使用uniapp来开发一个“我的钱包”页面，主要涉及以下几个关键知识点： 1. **uniapp...
uniapp微信小程序使用Echarts组件
07-28
uniapp微信小程序使用Echarts组件,使用实例 <echarts class="uni-ec-canvas" ref="echarts2" :option="option" canvasId="echarts1" id='echarts2'></echarts>
基于uniapp设计的微信小程序源码.zip
05-27
uniapp是一个跨平台的开发工具，它允许开发者用一套代码同时构建iOS、Android、H5、微信小程序等多个平台的应用。这里我们关注的是uniapp在微信小程序上的应用，这意味着源码是专门为微信小程序环境优化的。 【描述...
uniapp H5集成微信JS支付
03-26
uni-app框架下，开发H5，集成微信JS API支付，安装指定的，jweixin-module之后调用方法关键代码，搞了一星期，终于都搞明白，很简单，一看就懂了。
微信小程序开发纸质翻页效果源码-小程序翻页效果 uniapp实现
10-23
uniapp则是一个跨平台的开发框架，它支持多端运行，包括微信小程序、支付宝小程序、H5等。uniapp通过统一的语法，简化了多平台开发的复杂性，使得开发者可以编写一次代码，到处运行。在uniapp中实现翻页效果，可以...
uniapp 条件编译 APP 、 H5 、 小程序
weixin_44523517的博客
10-08 1839
uniapp 条件编译 APP 、 H5 、 小程序
uni-app
Koite的博客
07-18 4113
常见的开发小程序的前端框架有wepy（腾讯开发），uniapp，mpvue（美团）
uni-app 条件编译
m0_58492934的博客
06-16 6980
uni-app 已将常用的组件、JS API 封装到框架中，开发者按照 uni-app 规范开发即可保证多平台兼容，大部分业务均可直接满足。但每个平台有自己的一些特性，因此会存在一些无法跨平台的情况。在 C 语言中，通过 #ifdef、#ifndef 的方式，为 windows、mac 等不同 os 编译不同的代码。 uni-app 参考这个思路，为 uni-app 提供了条件编译手段，在一个工程里优雅的完成了平台个性化实现。条件编译是用特殊的注释作为标记，在编译时根据这些特殊的注释，将注释里面的代码编译到
uniapp开发通用小程序
m0_45041148的博客
11-02 3918
使用uni-app框架开发百度、微信小程序。
uniapp判断h5/微信小程序/app端
qq_38786840的博客
06-27 3967
写法：以 #ifdef 或 #ifndef 加 %PLATFORM% 开头，以 #endif 结尾。
关于小程序开发
xfWgaoqiang的博客
10-14 460
1. 判断该 标签 , js代码 , css样式 在那个端显示 那个端不显示 以 <!-- #ifdef APP-PLUS --> 开头 <!-- #endif --> 结尾 包裹的标签通过 APP-PLUS 判断条件 在那个端显示 标签中 <!-- #ifdef APP-PLUS --> <button type="primary" @click="open">点击</button> <!-- #
uniapp运用：如何引入全局样式，或者单独引入样式、设置页面底部的tabber、在pages里面设置一系列的信息、开启下拉刷新的各种方法、.触底请求数据、.uniapp请求数据的办法、Storage
m0_56986233的博客
03-19 5999
1.如何引入全局样式，或者单独引入样式 1.1单独引入样式 //在该页面的style中单独引入 <style> @import url("./a.css"); </style> 1.2全局引入 //在app.vue中引入 <style> @import url("./static/css/iconfont.css"); /*每个页面公共css */ /* 在这里定义的样式,全局都能生效 */ </style> 2.设置页面底部的tabber 2
uniapp 微信小程序跳转微信H5
05-12
可以使用微信小程序提供的 `wx.navigateToMiniProgram` 方法来打开一个微信公众号的 H5 页面。 以下是具体的步骤： 1. 确认要跳转的 H5 页面已经在微信公众号中创建好了，并且已经获取了对应的 `appId` 和 `path`。 2. 在小程序中调用 `wx.navigateToMiniProgram` 方法，并传入对应的参数，如下： ```javascript wx.navigateToMiniProgram({ appId: '公众号的appId', path: 'H5页面对应的路径', extraData: { // 可以传递一些额外的参数到 H5 页面中 }, success(res) { console.log('跳转成功', res) }, fail(res) { console.log('跳转失败', res) } }) ``` 注意，该方法只能在用户触发事件中调用（比如点击按钮），不能在 Page.onLoad 中调用。同时，需要在小程序的 `app.json` 文件中配置对应的公众号信息，具体可以参考微信小程序官方文档。
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值