Try It Yourself - SyntaxStudy Editor

HTML / CSS / JS

<ChildForm ref="childRef" />

const canvasEl  = ref(null);
const inputEl   = ref(null);
const childRef  = ref(null);
const listItems = ref([]);

const items = ref([
  { id: 1, name: 'Alpha' },
  { id: 2, name: 'Beta'  },
]);

onMounted(() => {
  // DOM element
  inputEl.value.focus();

// Canvas 2D drawing
  const ctx = canvasEl.value.getContext('2d');
  ctx.fillStyle = 'royalblue';
  ctx.fillRect(20, 20, 360, 160);

// Access exposed child method
  childRef.value?.reset();

// Array ref from v-for
  console.log('List items:', listItems.value.map(el => el.textContent));
});
</script>