3、Vue3 composition -- reactive API

  • reactive等价于 Vue 2.x 的Vue.observable()，用于获取一个对象的响应性代理对象
  • toRefs 将reactive对象转换为普通对象，其中结果对象上的每个属性都是指向原始对象中相应属性的ref引用对象

案例

<template>
    <div>
     {{name }} == {{ title }} 
    </div>
</template>
<script>

import { reactive, toRefs } from 'vue'

export default {
    name: 'page2',
    //
    setup() {
        const obj = reactive({
            name: 'zhangsan',
            title: '文案一'
        })
        // 直接返回obj对象
        // return { obj };
        // 转换成ref对象返回
        const  { name , title } =  toRefs(obj);
        return { name, title }
    }
}
</script>
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容