Vue3 setup

1、setup是一个函数，注意有返回值

2、组件中所用到的：数据、方法等，均要配置在setup中

3、setup函数返回值(两种)

a、返回对象，则对象中的属性、方法等在模板中可以直接使用

案例

<template>
  <h2>姓名：{{name}}</h2>
  <h2>年龄：{{age}}</h2>
  <button @click="showMessage">点击</button>
</template>

<script>

export default {
  name: 'App',
  components: {},
  setup() {
    let name ='jojo'
    let age = 8
    function showMessage(){
      alert(`大家好，俺是${name},俺今年${age}岁`)
    }
    return {
      name,
      age,
      showMessage
    }
  }
}
</script>

<style>

</style>

b、返回渲染值(了解)

4、注意点

不要与vue2混用