使用uniapp，可以开发一次多端覆盖。如果你要开发一个微信小程序，你可以选择使用微信官方的原生代码开发，但是你也只能是开发了一个微信的小程序应用。你也可以选择uniapp,同样可以开发一个微信小程序，可以说是“殊途同归”，但是绝不仅于此，使用uniapp开发的同时，你除了发布微信小程序应用之外，同时还可以发布app以及h5应用（当然还有很多其它端的应用，这里就不举了）。当然了，并不是你使用uniapp开发完微信小程序就可以多端发布，这里需要作一下不同端的语法兼容性处理，下面看一下是怎么处理的。
uniapp的语法兼容标签
#ifdef #ifndef #endif三者的意思
#ifdef仅在某个平台上使用
#ifndef在除了这个平台的其他平台上使用(非此平台使用）
#endif结束条件编译
认识各端平台标识的意思
标识平台
APP-PLUS5+App
MP微信小程序/支付宝小程序/百度小程序/头条小程序/QQ小程序
MP-WEIXIN微信小程序
MP-ALIPAY支付宝小程序
MP-BAIDU百度小程序
MP-TOUTIAO头条小程序
MP-QQQQ小程序
H5-H5
APP-PLUS-NVUE5+App nvue
认识了上面的语法标签和平台标识，接下来结合列子看下
仅在5+app平台上此代码生效
/*
可以使用// 或者 <!-- -->
*/
// #ifdef APP-PLUS
<view>仅在5+app平台上显示代码</view>
// #endif
methods: {
// #ifdef APP-PLUS
click(){
console.log('仅在5+app平台上生效的事件')
},
// #endif
}
非5+app平台上此代码生效
/*
可以使用// 或者 <!-- -->
*/
<!-- #ifndef APP-PLUS -->
<view>只要不是5+app平台上此代码会显示</view>
<!-- #endif -->
methods: {
<!-- #ifndef APP-PLUS -->
click(){
console.log('非5+app平台上生效的事件')
},
<!-- #endif -->
}
css 中使用
// 除H5以外的平台使用
.box{
/* #ifndef H5 */
position: fixed;
top: 0;
left: 0;
/* #endif*/
}
小结：使用uniapp“颠覆性”多端的开发，你需要掌握它多端的兼容性语法。更多技术文档请关注君兰IT
