Skip to content

Instantly share code, notes, and snippets.

Avatar

Thorsten Lünborg LinusBorg

View GitHub Profile
@LinusBorg
LinusBorg / Form.vue
Last active Jun 24, 2019
Consuming function-based plugin in object-based Vue component
View Form.vue
<template>
<form>
<input type="text" v-model="data.name" />
<span v-if="errors.name">{errors.name.msg{</span>
<span v-else>{{capsName}}</span>
<input type="number" v-model.number="data.age" />
<span v-if="errors.age">{errors.age.msg{</span>
</form>
</template>
View machine.js
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
View machine.js
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
View machine.js
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
View machine.js
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
@LinusBorg
LinusBorg / 0-vue3-typescript-caveats.md
Last active Dec 22, 2020
Vue 3 Typescript Caveats
View 0-vue3-typescript-caveats.md

About this collection

This gist is a work in progress. It's goal is to collect information about possible pitfalls when using Vue 3's proxy-base reactivity and Typescript, including solutions/remedies/workarounds.

Ultimately, the goal is to turn this into a part of the Vue documentation.

TOC

  1. Leaking this from the constructor, i.e. in async operations.
  2. ref()/reactive() unwrapping loses private fields type information