vue Vue.observable返回一个响应对象

逃离我推掉我的手 2021-07-24 16:31 401阅读 0赞

Vue.observable
    	让一个对象可响应,Vue内部会用它来处理data函数返回的对象。
    	也可以作为最小化的跨组件状态存储器
    	
    使用:
    	let ob=Vue.observable(object)	返回的对象可以直接用于渲染函数和计算属性内,会在发生变更时触发相应的更新
    
    和vue3.0区别:
    	在Vue 2.x中,被传入的对象会直接被Vue.observable变更,所以如这里展示的,它和被返回的对象是同一个对象。
    	在Vue 3.x中,则会返回一个可响应的代理,而对源对象直接进行变更仍然是不可响应的。

代码示例:

<template>
    <div id="list-complete-demo" class="demo">
      路由内容
    
      <div>
        <p @click="f">哈哈哈</p>
        <span>{ { g}}</span>
      </div>
    </div>
    </template>
    
    <script>
    
    import Vue from 'vue';
    let ob=Vue.observable({ count:0});
    
    export default { 
      name: 'HelloWorld',
      computed:{ 
        g(){ 
          return ob.count;
        }
      },
      methods:{ 
        f(){ 
          
          ob.count++;
    
        }
      }
    }

渲染函数:

const state = Vue.observable({  count: 0 })
    
    const Demo = { 
      render(h) { 
        return h('button', { 
          on: {  click: () => {  state.count++ }}
        }, `count is: ${ state.count}`)
      }
    }

发表评论取消回复

表情：

评论列表（有 0 条评论，401人围观）

还没有评论，来说两句吧...

相关阅读

相关【Spring MVC篇】返回响应

【Spring MVC篇】返回响应

Dear 丶/ 2024年04月27日 07:17/ 0 赞/ 23 阅读

相关请求对象和响应对象

（一）请求对象和响应对象的原理: request 和response 对象都是由服务器创建,管理,销毁. 由我们来使用. 继...

向右看齐/ 2024年04月18日 17:14/ 0 赞/ 13 阅读

相关 Vue--响应式

原文网址：[Vue--响应式\_IT利刃出鞘的博客-CSDN博客][Vue--_IT_-CSDN] 其他网址 > [vue中遇到的坑 --- 变化检测问题（数组相关）

╰半夏微凉°/ 2022年12月23日 03:53/ 0 赞/ 156 阅读

相关 php 返回一个空对象,PHP如何定义一个空对象

使用新数组我这样做： $aVal = array(); $aVal\[key1\]\[var1\] = "something"; $aVal\[key1\]\[var2\

青旅半醒/ 2022年11月12日 08:30/ 0 赞/ 482 阅读

相关响应对象Response

问题：视图函数的 return 和普通函数的 return 有什么区别。视图函数会返回状态码（status）、content-type（放置在http请求的headers

￡神魔★判官ぃ/ 2022年09月11日 06:23/ 0 赞/ 153 阅读

相关 response对象（响应对象）

1.response简介： > 1）想要获取客户端的内容，使用request对象。 > > > 2）对客户端做出响应，使用response对象。 > >

迈不过友情╰/ 2022年08月20日 04:12/ 0 赞/ 271 阅读

相关 map返回另一个对象

直接上图： 1、先定义一个对象 ![Center][] 2、再map一下它 ![Center 1][] 3、给map后的对象定义另一个名称，把a

超、凢脫俗/ 2022年06月06日 00:40/ 0 赞/ 296 阅读

相关 webservice +axis2 接收一个对象参数并返回一个对象

本人微信 zf363133213 欢迎各位添加好友，共同探讨问题本人公众号：java进阶 ![2019053120345735.jpg][] 做为服务端发布可以参考：

我会带着你远行/ 2022年05月28日 03:19/ 0 赞/ 180 阅读

相关 vue监听对象某一个属性

watch: { uploadObj: { //监听对象 deep: true, handler: fu

系统管理员/ 2021年07月25日 00:02/ 0 赞/ 388 阅读

相关 vue Vue.observable返回一个响应对象

Vue.observable 让一个对象可响应,Vue内部会用它来处理data函数返回的对象。也可以作为最小化的跨组件状态存储器

逃离我推掉我的手/ 2021年07月24日 16:31/ 0 赞/ 402 阅读