V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
daviszhang
V2EX  ›  前端开发

请教一些, vue 在移动端的体验

  •  
  •   daviszhang · 2023-12-18 09:00:55 +08:00 · 2938 次点击
    这是一个创建于 370 天前的主题,其中的信息可能已经有所发展或是发生改变。

    最近我司的项目,需要在移动端上访问。本来是想采用 flutter 的新架构,但是考虑到学习成本和团队技术倾向(都具有 js 的背景,所以倾向于网页开发),于是收集了相关资料,打算使用 vue 开发适配于移动端的网页来使用。 现在有 1 个问题,就是领导们希望,访问的效果类似于真实的 app 。 例如:1.浏览器打开,网页是全屏的 2.不要用浏览器打开,最好像个 app 一样安装 我想请教下各位大哥们,有没有办法浏览打开的时候隐藏工具栏和地址栏,或者假设不行,那么开发 pwa 这样的方案是否合适 谢谢啊

    27 条回复    2024-03-25 22:09:48 +08:00
    murmur
        1
    murmur  
       2023-12-18 09:01:38 +08:00
    必须得套壳,不过 cordova 已经几乎没有维护了,还不如 uniapp
    Geo200
        2
    Geo200  
       2023-12-18 09:04:30 +08:00
    这说白了就是一个类原生体验场景的开发问题,跟 vue 没关系
    hevi
        3
    hevi  
       2023-12-18 09:10:02 +08:00
    不如考虑 react native 、uniapp 、taro ?
    acthtml
        4
    acthtml  
       2023-12-18 09:20:30 +08:00
    用户非用不可,你又没资源开发的项目可以这样,否则流量转换都不行。
    liujavamail
        5
    liujavamail  
       2023-12-18 09:20:34 +08:00   ❤️ 1
    vue 的话,直接上 uniapp 就行, 不然就 ionic
    zqlcrow
        6
    zqlcrow  
       2023-12-18 09:21:36 +08:00
    不想用 Flutter ,那肯定用 React Native 啊。
    wuxidixi
        7
    wuxidixi  
       2023-12-18 09:26:52 +08:00
    效果不好的
    kylebing
        8
    kylebing  
       2023-12-18 09:36:03 +08:00   ❤️ 1
    如果只是在网页层面实现各种功能,那么可以直接网页,我只知道 iOS 上可以通过 PWA 的方式实现类似 app 的展示效果。可以参考这个: https://kylebing.cn/diary/ 在 safari 中打开之后,分享,然后选择将 “添加到主屏幕”,再从主屏幕打开就跟 app 相似。

    如果需要调用系统层面的功能,比如拍照、扫二维码、本地通知等,就需要一个壳子,这个壳子就相当于一个浏览器,不过这个壳子开放出了可以调用系统资源的一些接口供你在 web 层面调用。这些壳子有 ReactNative 、uniapp 、capacitor 等等,这些都可以打包成 iOS 和 Android 两个平台的安装程序。

    前端时间写过一个 app ,就是用这些玩意写的,反正是很抓狂:
    - uniapp 到处是坑,文档写的跟狗屎一样,什么都想做,还什么都做不好,感觉这玩意就不该出现,完全是适配各种奇葩需求出来的不伦不类的东西。
    - capacitor 相当健壮,文档清晰明了,各种系统层面的插件非常明了。https://capacitorjs.com/
    - ReactNative 不熟,只用它写过一个纯壳子,不多作评价。

    归总起来就是,用网页做类似 app 的东西,挺麻烦,这个过程是非常不愉快的。如果只是在网页层面实现的功能,那还差不多。
    aahao
        9
    aahao  
       2023-12-18 09:40:58 +08:00
    React Native
    duanxianze
        10
    duanxianze  
       2023-12-18 09:46:10 +08:00
    你这种就是 Uniapp 最好了,不要想着啥类原生,直接就是小程序,类似微信小程序就行了
    datoujiejie221
        11
    datoujiejie221  
       2023-12-18 09:57:27 +08:00
    当年因为 vue 的技术栈,还用过阿里的 weex ,然后就不维护了,好像 uniapp 的 nvue 就是基于 weex 改进的,其实 weex 的设计思想还是可以的,就是国内的开源生态还是太差了。
    基于 js 的跨端技术感觉都是越到后面坑越多,建议还是用网页开发。
    owen800q
        12
    owen800q  
       2023-12-18 10:02:34 +08:00 via iPhone
    @murmur webview 上不了架
    murmur
        13
    murmur  
       2023-12-18 10:04:50 +08:00
    那就给他原生做个登录页面,还有那种 header+tab 的页面,中间套 webview ,不让上架的是 webview+远程,又不是本地资源
    vishun
        14
    vishun  
       2023-12-18 10:05:08 +08:00
    `有没有办法浏览打开的时候隐藏工具栏和地址栏`h5 的话这个应该不行,你一个网页哪有权限来做这些东西,就算某些浏览器开放了这个接口,能保证用户都会用这个浏览器吗?而 pws 是依赖浏览器的,谁能保证客户一定会在提示时就添加为 pwa 呢?感觉要实现这些功能,要么小程序要么开发 app 。
    wolfan
        15
    wolfan  
       2023-12-18 10:07:31 +08:00
    有个问题,你们的用户是国内用户还是国外用户。或者说国产机( MI\H\O\V )为主还是三星、水果为主。
    如果是国内的话,PWA 其实不合适,因为国产品牌对 PWA 是各有不同的腌制。而是单独搞了一个‘轻应用联盟’,轻应用和 PWA 差不多,但调用的资源更多一些。所以如果是国产为主就上轻应用,如果还要兼顾水果、三星这些就需要单独维护个 PWA 。
    monologue520
        16
    monologue520  
       2023-12-18 10:16:06 +08:00
    RN
    wa143825
        17
    wa143825  
       2023-12-18 11:09:32 +08:00
    体验过 2 个 uniapp 开发的大型 app
    我们的 OA 系统,功能非常多,是要代替钉钉的,卡的不要不要的。
    给华润做项目外包时,他们的移动端报表平台,感觉不如直接用浏览器。
    bu9
        18
    bu9  
       2023-12-18 11:10:53 +08:00
    X + webview + jsBridge + html5
    sundev
        19
    sundev  
       2023-12-18 11:11:58 +08:00
    最近也在弄这个,最初跟你的想法一样,想上 flutter ,后来初期验证后感觉前端想直接上手 flutter 还是有难度的。
    后来我直接使用 vue+vant 一把梭,然后使用 capacitor 来打包一下,一般使用没有问题。如果交互场景复杂,那么 web 套壳肯定不行了。
    vaccer
        20
    vaccer  
       2023-12-18 11:19:55 +08:00 via iPhone
    写过一个 uniapp 项目,那体验一言难尽。
    后来推翻用 react-native 重做了
    meteor957
        21
    meteor957  
       2023-12-18 11:24:30 +08:00 via Android
    React Native
    southsala
        22
    southsala  
       2023-12-18 16:45:48 +08:00
    你想用前端的技术栈还想要客户端的效果只能用 React-Native 。
    zhoushuo
        23
    zhoushuo  
       2023-12-18 16:59:58 +08:00
    用 uniapp 开发过两三个项目,说实话开发体验有点糟糕,app 的使用体验和原生也有一定差距,建议用 RN
    daviszhang
        24
    daviszhang  
    OP
       2023-12-19 11:28:43 +08:00
    谢谢各位大哥们的回复,uniapp 不写小程序就不考虑了
    现在还是倾向于 pwa 。pwa 基本满足我们的需求
    React-Native:团队没有兴趣学 react ,更倾向于 vue 框架 (毕竟是国人参与开发)
    capacitor:这个很有兴趣,如果要打包的话,肯定很有用
    原生做个登录页面: 团队的人不会原生开发的,要学习又得学新语言和布局方式,真要用原生我觉得不如直接学 flutter ,毕竟性能上不要求太高
    daviszhang
        25
    daviszhang  
    OP
       2023-12-19 11:29:15 +08:00
    @kylebing 谢谢老哥,capacitor 提供了另一种思路
    daviszhang
        26
    daviszhang  
    OP
       2023-12-19 11:29:50 +08:00
    @vishun 单纯的 js 确实做不到,不过 pwa 倒是可以,前提需要用户打开网页和安装
    jamesjammy061
        27
    jamesjammy061  
       271 天前
    @kylebing 老哥,感谢分享。想问一下 用 expo 作为壳咋样?其实想实现和 capacitor 差不多的效果,但是生态感觉要好很多,而且一定程度上可以自己 DIY 壳
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2967 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 13:11 · PVG 21:11 · LAX 05:11 · JFK 08:11
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.