Vue3
Taro can be developed using Vue 3. Developers can use the taro init
command to create templates for Vue 3, including default, vuex, and NutUI. We recommend using NutUI4.0 templates for development.
For details, please refer to the Taro Vue series documentation.
Developers can choose to organize their logic using options-style configuration or the Composition API and browse the [Vue 3 documentation](https://v3. vuejs.org/) to learn more about Vue3 changes.
Other limitations
<style scoped>
is not supported in the mini-program, it is recommended to use cssModules instead.#6662- Elements cannot be inserted outside the DOM tree of a page component, so
<teleport>
is not supported - The internal implementation of Vue 3 uses Proxy, which does not work on iOS 9 and below. However, the official Vue team will release a compatible version after the official release.
- Using ref on the H5 side to get the DOM node of the base component now only gets the Vue component instance of the adaptation layer, not the corresponding webComponent root node. This was possible in Vue2 by modifying the refs property of the parent element, but the order of initialization between components has changed in Vue3, so it is not supported for now.
- The v-model binding property of Vue3 has been changed to modelValue and the event binding has been changed to update:modelValue. For example, input automatically corresponds to modelValue and value, update:modelValue and @input, but for Picker, which is an mini program-specific form, it does not, so we recommend not using v-model in this case.
- The VirtualList component needs to implement a Vue3 version (to be implemented)
- The
id
of all components must remain unique throughout the application (even if they are on different pages), otherwise it may cause problems with events not firing.#7317
Related Reading
New Vue3 features can be found in the Vue3 documentation.
How Taro is compatible with Vue3 can be found in Taro RFC.
Developing Applets with Vue3 by lillian.
NutUI Development Example by jdf2e.