目錄
回复内容:
首頁 web前端 H5教程 Vue.js适合制作移动端的Webapp吗?

Vue.js适合制作移动端的Webapp吗?

Jun 07, 2016 am 08:41 AM
js spa vue

公司有个项目,要做移动的SPA,想要尝试使用Vue.js来制作,但是目前有几点疑问,不确定Vue.js是否适用。
1.Vue.js是否适合移动端
2.Vue.js做移动端的SPA,转场动画是否有相关的解决方案
3.Vue.js是否有适合移动端的组件

回复内容:

可以,完全可以。
技术选型是这样:
vue+vue-strap+babel(es6)+webpack+vue-router

相关文档:
起步 - vue.js
介紹 | vue-router文档 npm package
yuche/vue-strap · GitHub
webpack module bundler

我写了个种子文件,题主可以参考(把seed打成feed了请无视)
leinue/vue-feeds · GitHub

运行使用:
<span class="n">npm</span> <span class="n">run</span> <span class="n">dev</span>
登入後複製
1.vue非常适合在移动端使用。
2.vue当然有很易用的过渡系统过渡效果 - vue.js
3.vue可以很方便地直接使用现有的一下组件,这个是最近发布的vue bootstrap 组件github.com/yuche/vue-st发布的了,很快会有很多组件出来吧。 个人感觉SPA单页应用最主要的是router,有router就可以搞了吧
1.Vue.js是否适合移动端
适合,vue的强大就是他够灵活,适合不同的业务类型,
轻量的:vue+vue-resource,就可以跑了,
然后根据自己的需要加:vue-router,vue-loader,
2.Vue.js做移动端的SPA,转场动画是否有相关的解决方案
例子:lazyhero/vue-spa-demo · GitHub
3.Vue.js是否有适合移动端的组件
github上有不少:Search · vue · GitHub

最后福利,vuejs高质量群:364912432,禁发无意义大gif,非喜勿加。 说个与Vue.js无关,但是与兼容性有关。

一般来说技术选型是要考虑面向群体的。

如果对象是程序员就可以使用各种技术。

如果要考虑兼容低版本Android,即早期浏览器,还是用jQuery。 可以参考我的案例,很容易上手。GitHub - shinygang/Vue-cnodejs: 基于vue.js重写Cnodejs.org社区的webapp. 在楼上各位的答案指引下,个人亲自体验过,vue.js做移动webapp非常合适,而且开发过程思路非常清晰。这段时间新鲜出炉了项目:GitHub - Geocld/vue-vueRouter-note-Firebase-mobile: 一个基于vue.js和Firebase制作的笔记spa(mobile端),UI库使用light7,页面切换使用vue-router。

app很简单,使用vuejs自不必说,组件开发模块管理使用vue-loader、webpack,页面切换以及过场动画使用vue-router,在app开发过程只需关注app的数据走向即可,另外可以搭配各类UI库让你的应用更加美观,正如楼上答过的,使用SUI或Framework7都可以,我使用的是Framework7一个分支版本light7(因为后续的功能补充可能用到jQuery。如果涉及数据后台同步可以配合后端语言进行开发,我选用了Google现成的Firebase作为数据存储端。 Vue在DOM渲染上的效率相比ng、react要高很多,有人跑过分。路由和模块化+webpack就可以了,UI组件的话推荐Vux 个人觉得,只要支持
1. mvvm
2. frontend router
的框架,其实就都挺适合webapp的

不确定楼主的spa最终会不会打包成真正的app
如果是,相对vue,其实我更推荐ionic + angularjs
ionic毕竟对webapp做了很多优化,而且提供了一些css + js的builtin,更适合新手一些 vue很轻量,灵活,易定制,很适合移动端的开发,个人比较喜欢vue写组件的方式
参考项目:eteplus/vue-sui-demo: 用VUE 和 SUI-Mobile 写了一...
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1660
14
CakePHP 教程
1417
52
Laravel 教程
1311
25
PHP教程
1261
29
C# 教程
1234
24
vue中怎麼用bootstrap vue中怎麼用bootstrap Apr 07, 2025 pm 11:33 PM

在 Vue.js 中使用 Bootstrap 分為五個步驟:安裝 Bootstrap。在 main.js 中導入 Bootstrap。直接在模板中使用 Bootstrap 組件。可選:自定義樣式。可選:使用插件。

vue怎麼給按鈕添加函數 vue怎麼給按鈕添加函數 Apr 08, 2025 am 08:51 AM

可以通過以下步驟為 Vue 按鈕添加函數:將 HTML 模板中的按鈕綁定到一個方法。在 Vue 實例中定義該方法並編寫函數邏輯。

vue中的watch怎麼用 vue中的watch怎麼用 Apr 07, 2025 pm 11:36 PM

Vue.js 中的 watch 選項允許開發者監聽特定數據的變化。當數據發生變化時,watch 會觸發一個回調函數,用於執行更新視圖或其他任務。其配置選項包括 immediate,用於指定是否立即執行回調,以及 deep,用於指定是否遞歸監聽對像或數組的更改。

vue多頁面開發是啥意思 vue多頁面開發是啥意思 Apr 07, 2025 pm 11:57 PM

Vue 多頁面開發是一種使用 Vue.js 框架構建應用程序的方法,其中應用程序被劃分為獨立的頁面:代碼維護性:將應用程序拆分為多個頁面可以使代碼更易於管理和維護。模塊化:每個頁面都可以作為獨立的模塊,便於重用和替換。路由簡單:頁面之間的導航可以通過簡單的路由配置來管理。 SEO 優化:每個頁面都有自己的 URL,這有助於搜索引擎優化。

vue返回上一頁的方法 vue返回上一頁的方法 Apr 07, 2025 pm 11:30 PM

Vue.js 返回上一頁有四種方法:$router.go(-1)$router.back()使用 &lt;router-link to=&quot;/&quot;&gt; 組件window.history.back(),方法選擇取決於場景。

React與Vue:Netflix使用哪個框架? React與Vue:Netflix使用哪個框架? Apr 14, 2025 am 12:19 AM

NetflixusesAcustomFrameworkcalled“ Gibbon” BuiltonReact,notReactorVuedIrectly.1)TeamSperience:selectBasedonFamiliarity.2)ProjectComplexity:vueforsimplerprojects:reactforforforproproject,reactforforforcompleplexones.3)cocatizationneedneeds:reactoffipicatizationneedneedneedneedneedneeds:reactoffersizationneedneedneedneedneeds:reactoffersizatization needefersmoreflexibleise.4)

vue遍歷怎麼用 vue遍歷怎麼用 Apr 07, 2025 pm 11:48 PM

Vue.js 遍歷數組和對像有三種常見方法:v-for 指令用於遍歷每個元素並渲染模板;v-bind 指令可與 v-for 一起使用,為每個元素動態設置屬性值;.map 方法可將數組元素轉換為新數組。

vue.js怎麼引用js文件 vue.js怎麼引用js文件 Apr 07, 2025 pm 11:27 PM

在 Vue.js 中引用 JS 文件的方法有三種:直接使用 &lt;script&gt; 標籤指定路徑;利用 mounted() 生命週期鉤子動態導入;通過 Vuex 狀態管理庫進行導入。

See all articles