What is the difference between vue and uni-app

The difference between vue and uni-app: 1. uni-app can realize a set of code to run on multiple terminals through packaging, but vue cannot; 2. uni-app has automatic frame preloading, loading pages faster Fast, vue does not have it; 3. uniapp uses the tags of the mini program, and vue uses the tags of the web side; 4. uni does not support vue-router and uses its own routing.

The operating environment of this tutorial: windows7 system, uni-app2.5.1&&vue2.9.6 version, Dell G3 computer.

The difference between uniapp and vue

uni-app can be compiled into (Toutiao, Alipay, WeChat, QQ, Baidu) applet, Android version, ios version, h5 Version. Through packaging, a set of codes can be run on multiple terminals; Vue is designed for single-page applications on the web, but on apps, single-page applications will get stuck.

uni-app also has automatic frame preloading, loading pages faster.

Changes in components/labels

It used to be html tags, but now it is mini program tags.

• p Change to view
• span, font to text
• a Change to navigator
• img Change to image
• Input is still there, but the type attribute has been changed to confirmtype
• form, button, checkbox, radio, label, textarea, canvas, video
  These are still there.
• select Change to picker
• iframe Change to web-view
• ul and li are gone, use view instead
• audio is no longer recommended, Change to api mode, background audio api document
  In fact, old HTML tags can also be used in uni-app. The uni-app compiler will convert the old tags into new tags during compilation, such as compiling p into view. However, this usage is not recommended, as it can easily cause confusion when debugging the H5 end.

In addition to changes, a number of new components commonly used on mobile phones have been added

• scroll-view area Scroll view container

• swiper Swipeable area view container

• icon icon

• rich-text Rich text (cannot execute js, but can render various text formats and images)

• progress progress bar

• slider slider indicator

• switch switch selector

• camera camera

• live-player live broadcast

• map map

• cover-view A view container that can cover native components

cover-view needs to be emphasized more In other words, the video, map, canvas, and textarea on the non-h5 side of uni-app are native components and are higher level than other components. If you need to cover native components, such as adding a mask to the map, you need to use the cover-view component

In addition to built-in components, there are many open source extension components that encapsulate common operations. DCloud has established The plug-in market includes these extension components. For details, please see the plug-in market

Js

Because the API of uni-app refers to the mini program, it is similar to the browser's js API. There are many differences, such as

1. alert, confirm changed to uni.showmodel
2. ajax axios changed to uni.request
3. cookie and session are gone, local .storage was changed to uni.storage
4. vue-router is gone and changed to uni.navigateTo

There are many js apis of uni-app, but basically For the mini program's API, just change wx.request to uni.request.

uni-app supports conditional compilation on different terminals and can use the unique API of each terminal without restrictions.

uniapp comes with its own routing and request methods

uni.navigateTo routing and page jump
uni.request network request

Related recommendations: "vue.js tutorial", "uniapptutorial》

The above is the detailed content of What is the difference between vue and uni-app. For more information, please follow other related articles on the PHP Chinese website!