vue3-setup(引用和方法)

setUp函数

  • 使用Composition API 的入口
  • 在beforeCreate之前调用
  • 在setup中没有this
  • 返回对象中的属性刻在模板中使用
    <template>
      <div id="app">
        {{name}}
        <p>{{age}}</p>
        <button @click="plusOne()">+</button>
      </div>
    </template>
    
    <script>
    import {ref} from 'vue'
    export default {
      name:'app',
      data(){
        return {
          name:'xiaosan'
        }
      },
      setup(){
        const name =ref('小四')
        const age=ref(18)
        function plusOne(){
          age.value++ //想改变值或获取值 必须.value
        }
        return { //必须返回 模板中才能使用
          name,age,plusOne
        }
      }
    }
    </script>

     

 

posted on 2020-09-01 10:39  秃了头也不退休  阅读(41154)  评论(0编辑  收藏  举报

导航