位置: IT常识 - 正文

Vue中computed和watch的区别(vue中computed和watch区别)

编辑:rootadmin
Vue中computed和watch的区别

推荐整理分享Vue中computed和watch的区别(vue中computed和watch区别),希望有所帮助,仅作参考,欢迎阅读内容。

Vue中computed和watch的区别(vue中computed和watch区别)

文章相关热门搜索词:vue computed和watch,vuecomputed和method,vuecomputed和method,vue的computed和methods,vue中computed和watch区别,vue中computed和methods区别,vue中computed和method区别,vue中computed和methods区别,内容如对您有帮助,希望把文章链接给更多的朋友!

今天简单说一下computed和watch的区别。 先看代码,两者怎么实现的。

<div id="app"> <input type="text" v-model="firstName"><br> <input type="text" v-model="lastName"><br> <h2>{{fullName()}}</h2> </div><script> var app = new Vue({ el: '#app', data: { firstName: '张', lastName: '三', fullName: '张三' }, // watch 监视、监听,在此处定义监听器 // 作用:监视data中的数据变化 watch: { // 侦听器以函数的形式定义,函数名称就是监视的数据的名称,参数就是数据变化后的新值 firstName(val) { console.log(val); this.fullName = val + this.lastName; }, lastName(val) { console.log(val); this.fullName = this.firstName + val; } } }) //计算属性方式实现 var app = new Vue({ el: '#app', data: { firstName: '张', lastName: '三', }, computed: { // 计算属性在某些场景下(此示例),要比侦听器代码精简。 fullName() { return this.firstName + this.lastName; } } })</script>

computed和watch的区别 1、computed是计算属性;watch是监听,监听data中的数据变化。 2、computed支持缓存,当其依赖的属性的值发生变化时,计算属性会重新计算,反之,则使用缓存中的属性值;watch不支持缓存,当对应属性发生变化的时候,响应执行。 3、computed不支持异步,有异步操作时无法监听数据变化;watch支持异步操作。 4、computed第一次加载时就监听;watch默认第一次加载时不监听。

immediate 组件创建时刻执行与否 immediate: true,第一次加载时监听(默认为false)deep 深度监听 不推荐使用(非常的消耗性能) 监听的属性是对象的话 不开启deep 对象子属性变化不会触发watch 开启了deep 对象内部所有子属性变化 都会触发watch

5、computed中的函数必须调用return;watch不是。 6、使用场景: computed:一个属性受到多个属性影响,如:购物车商品结算。 watch:一个数据影响多条数据,如:搜索数据。 数据变化响应,执行异步操作,或高性能消耗的操作,watch为最佳选择。

本文链接地址:https://www.jiuchutong.com/zhishi/299551.html 转载请保留说明!

上一篇:一文通透从输入URL到页面渲染的全过程----高频面试

下一篇:Http协议之Content-Type理解

  • 企业稳岗返还申请报告模板
  • 产品成本计算的基本方法和辅助方法的划分标准是
  • 重分类八个对应科目有哪些
  • 个人所得税纳税比例
  • 借款利息是否可以转为本金
  • 间接费用是指
  • 银行转账结算方式的种类及适用范围
  • 在建工程试运行收入和成本怎么处理
  • 长期股权投资的初始计量
  • 个人利息收入交不交增值税
  • 一般企业的会计原始凭证有哪些类型
  • 出售已计提减值准备的固定资产
  • 在天猫店铺后台中的提现怎么做会计分录?
  • 包装物报废收回残料
  • 基本户没开 可以销户吗
  • 企业清算期间账务怎么做
  • 贷款损失准备如何提取
  • 残联备案还能补申报吗
  • windows10office更新
  • 库存车转入固定资产
  • 哪些凭证可以抵扣
  • 能开运费发票吗?
  • 计提存货减值准备符合可靠性原则
  • 营改增后增值税税率
  • 无法ping通ip地址
  • 分期付款购买固定资产折现率怎么算
  • php实现文件下载功能
  • 出售固定资产申报表收入与损益表收入不一致
  • 破产清算子公司
  • 税收滞纳金可以抵税吗
  • batch size 大小
  • 新建厂房费用应计入什么
  • 何为前端后端
  • php设计模式及使用场景
  • 国企无偿划转股权免印花税
  • 季度利润表是累计数吗
  • 在零售环节征收消费税的是哪些
  • 营业额的纳税比例是多少
  • 企业缴纳个人所得税客户端
  • 行政单位基建账并入大账规定
  • 小微企业 附加税
  • 广告类的公司
  • 创投收入
  • 材料款已付,发票没来
  • 预付加油款收到发票怎么处理
  • 二手设备进口报关流程
  • 查账征收的优点
  • 账本结转下年怎么划线
  • 进项税额被转出怎么做账
  • 私营企业固定资产折旧
  • win10预览版绿屏重启解决
  • xp桌面消失 右击无反应
  • mac支持的字体格式
  • Stacmon.exe - Stacmon是什么进程 有何作用
  • windows英文字体
  • load its core dll
  • win1020h2无法重启
  • win7误删我的文档
  • 在Linux命令行中快速删除光标前的快捷键是什么?
  • win7 设置
  • won7系统优化
  • cocos2dx视频教程
  • JS实现的base64加密解密完整实例
  • 浅谈jQuery中Ajax事件beforesend及各参数含义
  • shell脚本运行linux命令
  • nodejs实战
  • vb中chr$(13)是什么意思
  • 深入python3
  • javascript中函数
  • shell可以多线程吗
  • android深度探索(卷1):hal与驱动开发
  • javascriptz
  • unityui渲染顺序
  • js浏览器运行机制
  • js数组entries
  • 安卓手机管家怎么关闭
  • javascript基础教程教材答案
  • 河北省国家税务局电子税务局
  • 专项调查法
  • 杭州税务稽查举报电话
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设