목차
回复内容:
웹 프론트엔드 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 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

AI Hentai Generator

AI Hentai Generator

AI Hentai를 무료로 생성하십시오.

인기 기사

R.E.P.O. 에너지 결정과 그들이하는 일 (노란색 크리스탈)
2 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. 최고의 그래픽 설정
2 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. 아무도들을 수없는 경우 오디오를 수정하는 방법
3 몇 주 전 By 尊渡假赌尊渡假赌尊渡假赌

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

모바일 터미널의 멀티 라인 오버 플로우 누락과 호환되는 방법은 무엇입니까? 모바일 터미널의 멀티 라인 오버 플로우 누락과 호환되는 방법은 무엇입니까? Apr 05, 2025 pm 10:36 PM

VUE 2.0을 사용하여 모바일 애플리케이션을 개발할 때 다른 장치에서 멀티 로우 오버플로의 호환성 문제가 종종 텍스트를 넘어서야 할 필요성을 만듭니다 ...

H5 페이지 제작은 프론트 엔드 개발입니까? H5 페이지 제작은 프론트 엔드 개발입니까? Apr 05, 2025 pm 11:42 PM

예, H5 페이지 제작은 HTML, CSS 및 JavaScript와 같은 핵심 기술을 포함하는 프론트 엔드 개발을위한 중요한 구현 방법입니다. 개발자는 & lt; canvas & gt; 그래픽을 그리거나 상호 작용 동작을 제어하기 위해 JavaScript를 사용하는 태그.

H5 페이지 프로덕션의 임계 값이 높습니까? H5 페이지 프로덕션의 임계 값이 높습니까? Apr 05, 2025 pm 11:45 PM

H5 페이지를 만드는 임계 값은 목표에 따라 높거나 낮지 않습니다. 간단한 정적 페이지를 만드는 것이 더 쉽습니다. HTML 및 CSS의 기본 지식 만 마스터하면됩니다. 인터랙티브하고 풍부한 기능이 강한 페이지를 만드는 것은 비교적 높으며 HTML, CSS, JavaScript, 프론트 엔드 프레임 워크, 성능 최적화 및 호환성에 대한 심층적 인 지식이 필요합니다.

개미 디자인 캘린더 구성 요소는 일요일에 첫 번째 열에 나타나는 현재 구성 요소 만 어떻게 수정합니까? 개미 디자인 캘린더 구성 요소는 일요일에 첫 번째 열에 나타나는 현재 구성 요소 만 어떻게 수정합니까? Apr 05, 2025 pm 08:12 PM

Antdesign 달력 구성 요소 첫 열은 Antdesign을 사용한 일정의 솔루션을 보여줍니다 ...

H5 페이지를 만드는 데 좋은 도구 H5 페이지를 만드는 데 좋은 도구 Apr 06, 2025 am 06:33 AM

적절한 H5 페이지 제조 도구는 기술 수준에 따라 결정됩니다. 초보자는 시각적 편집기 (예 : 온라인 플랫폼 또는 웹 사이트 구축 도구), 고급 사용 코드 편집기 (예 : 숭고한 텍스트)와 보조 도구 (예 : 프레임 워크, 패키지 관리 도구, 디버깅 도구) 및 마스터 수준 도구를 자체적으로 개발할 수 있습니다. 도구 선택은 보조이므로 핵심은 개인적인 능력과 지속적인 학습입니다.

VUE3 비 세트 구문 설탕에서 CSS V-Bind에서 구성 요소 소품을 우아하게 사용하는 방법은 무엇입니까? VUE3 비 세트 구문 설탕에서 CSS V-Bind에서 구성 요소 소품을 우아하게 사용하는 방법은 무엇입니까? Apr 05, 2025 pm 11:06 PM

VUE3 비 세트 구문 설탕의 CSS에서 우아하게하는 방법 ...

H5 Page 프로덕션과 WeChat 애플릿의 차이점은 무엇입니까? H5 Page 프로덕션과 WeChat 애플릿의 차이점은 무엇입니까? Apr 05, 2025 pm 11:51 PM

H5는보다 유연하고 사용자 정의 가능하지만 숙련 된 기술이 필요합니다. 미니 프로그램은 신속하게 시작하고 유지 관리가 쉽지만 WeChat 프레임 워크에 의해 제한됩니다.

H5 페이지 프로덕션의 성능을 최적화하는 방법 H5 페이지 프로덕션의 성능을 최적화하는 방법 Apr 06, 2025 am 06:24 AM

네트워크 요청, 리소스로드, 자바 스크립트 실행 및 렌더링 최적화를 통해 H5 페이지의 성능을 향상시킬 수 있으며 매끄럽고 효율적인 페이지를 만들 수 있습니다. 자원 최적화 : 압축 이미지 (예 : TinypNG 사용), 단순화 된 코드 및 활성화 된 브라우저 캐싱. 네트워크 요청 최적화 : 파일 병합, CDN 사용 및 비동기 적으로로드하십시오. JavaScript 최적화 : DOM 작업을 줄이고, requestAnimationFrame을 사용하며, 가상 DOM을 잘 활용하십시오. 고급 기술 : 코드 세분화, 서버 측 렌더링.

See all articles