Давайте теперь рассмотрим, что же собой представляет методы в подходе Composition API Vue.

Когда мы с вами программируем в подходе Options API, методы мы описывали внутри опции methods. 

methods: {

  method1() {

  console.log('3');

 }

}

Пусть у нас будет method1, который будет выводить в консоль какую-то строку.

Мы можем создать какую-то кнопочку, например, назвать её "кнопка", и при клике по этой кнопке вызывать метод. 

<button @click="method1">Кнопка</button>

Кликаю по кнопке, и у меня вызывается этот метод. 

В случае, если мы хотим использовать метод внутри Composition API, мы должны с вами создать там функцию. Метод, по сути, это обычная JavaScript функция. 

function method2() {

 console.log('555');

}

Если мы задаем методы в опции setup, также, как и переменные они должны возвращаться в объекте return.

setup() {

  function method2() {

    console.log('');

 }

  return {method2}

}

При использовании подхода script setup, это не обязательно.

Если мы перейдем во вкладку View в панели для отладки, мы с вами видим такое преимущество подхода Composition API, то что мы видим методы, которые есть в нашем объекте, в нашем компоненте. 

Мы видим присутствие method2, в отличие же от Options API, где мы не видим,  методы, которые у нас тоже присутствует в нашем компоненте. 

Это плюс в отладке таких приложений. 

Соответственно, такой способ. В итоге, такая ситуация, что методы в нашем подходе Composition API представляет собой обычные JavaScript функции, которые точно так же, как и уровень данных, должны вернуться нашим методом setup и использоваться уже внутри template.