Vue native beginer

Vue js

Implement guile

# Vue native cli
npm install --global vue-native-cli
# For Expo users
npm install --global expo-cli
vue-native init <projectName>
$ cd <projectName>
$ npm start
$ npm run android/ios

The composition API

• Ref
• Reactive
• Computed Values
• Watch
• WatchEffect
• Props
• Lifecycle Hooks

---

reactive vs ref

- reactive() only takes objects, NOT JS primitives (String, Boolean, Number, BigInt, Symbol, null, undefined).
- ref() is calling reactive() behind the scenes.
- Since reactive() works for objects and ref() calls reactive(), objects work for both.
- BUT, ref() has a .value property for reassigning, reactive() does not have this and therefore CANNOT be reassigned.

reference reactive with ref.

Lifecycle Hooks

vue 3 lifecycle hooks

Options API	Hook inside setup
beforeCreate	Not needed*
created	Not needed*
beforeMount	onBeforeMount
mounted	onMounted
beforeUpdate	onBeforeUpdate
updated	onUpdated
beforeUnmount	onBeforeUnmount
unmounted	onUnmounted
errorCaptured	onErrorCaptured
renderTracked	onRenderTracked
renderTriggered	onRenderTriggered
activated	onActivated
deactivated