vue.js 3 [3] fragment / 함수 사용

vue.js 2 -> 3 바뀐 점

<template> 안에서 여러개 element를 하나의 <div>로 감싸줘야했는데 3에서는 감싸지 않아도 됨

---

<script>
export default {
  setup(){
    const name = 'chocho ';

    const greeting = (name) => {
      return 'Hello,' + name;
    };

    const greet = greeting(name);

    return {
      name,
      greeting,
      greet
    };
  }
}
</script>

 

<script> 안에서 함수를 정의하거나, 함수를 사용하여 만든 새로운 변수를 return할수 있다.

그러면 <template>에서 모두 사용할 수 있고, 함수는 사용할 때 {{ greeting() }} 형태로 ()를 붙여서 사용한다.