理解计算属性等

计算属性

计算属性的作用是将写在computed内的写了对应的属性名,属性值都是函数,将这属性值的函数调用之后的返回值赋给属性名的变量。因此其实计算属性内的是值,不是方法,因此写插值等语句是只是写变量,而不是调用。且与方法不同,写了多个方法名调用需要调用多次,计算属性只是变量。但是计算属性的返回值与哪些响应式变量有关,则这些改变,就会重新调用属性值的函数赋给计算属性。

因此如果是只是为了用计算属性的值,无需用方法的放回值,但是如果是为了方法内的不走的代码,则用方法。

计算属性的不同点

计算属性与其他等不同之处在于。当除却是与之相关的响应式数据改动了计算属性的值,其他的属性值当改变值是响应式会渲染页面。但是其他的属性值改变没有条件,这里计算属性如果需要改变赋值,需要些set函数。计算属性

完整写法当中,计算属性名,的属性值是对象,对象的set方法,和get方法的返回值。在new Vue给实例对象赋了这么一个变量,但是修改前访问是否有set方法,内存当中。如果计算属性值只是函数,则只代表get而没有set。当判断计算属性值没有set,则只是一个变量,否则,则将这个计算属性值为对象,对象内有set,get方法,当在模板语句钟些的是变量,则自动去调用对象的get方法。只有get方法,则变量定义为只读,有set方法的为可读可改。使得改这个属性值和读这个属性值,都不去该变量,而是去执行get和set方法,如果只是获取计算属性值只是get方法内的返回值,改也不是改变对象,只是去执行ser方法。

监听属性watch

监听属性watch,属性值是对象,对象内的属性名是需要监听的变量,监听可以监听除却方法外的,属性值是当监听到值变化,则会调用的函数,且函数第一个是新值,第二个是旧值。这个其实和数据响应式一样啊,响应式也是监听数据变,去更新页面,这不过是执行函数。先执行函数,再去更新页面。

watch和响应式一样,响应式是对于所有的数据,包括计算属性,但是计算属性改变,访问是对象的get,修改也不是对象修改的值,而是去执行set。

完整写法

监听属性的属性值可以写函数/对象,对象则找handle的属性值,也可也在对象内些deep:true/false

是怎么样算这个变量改变了,deep:true是对象内的属性改变了也算。deep:false只有这个对象的地址/值。响应式是深的,以及这个watch内的监听属性的函数,可以new Vue前先执行一次。

这些判断true的都是可以些任意类型的会转成布尔来看。immediate会立刻在vue的时候执行,给window对象的console对象内赋值,当打开浏览器时,window会改变此刻的浏览器的值。

生命周期函数和钩子函数

vue实例的生命周期

八个钩子函数

八大钩子函数

       前面的四个阶段,其实就是执行这些步骤的一个时间点

而如果在new vue的参数的对象钟写这几个属性名,会在执行这四个阶段前,先执行函数。

在mounted之后,页面已经有了响应式数据渲染的页面,此刻可以修改响应式数据,等,之前修改没有改的效果

Create可以发送异步请求,因为异步请求后的数据有可能赋给响应式的数据,因此得有才行。

在销毁之前可以先销毁一些不会再用的宏任务队列内的。如定时器等。

这两个两个队列的都是在事件发生前一定会执行的函数,在事件发生后执行的。在实例内写了这几个函数,会先在阶段前去执行。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://xiahunao.cn/news/2871209.html

如若内容造成侵权/违法违规/事实不符,请联系瞎胡闹网进行投诉反馈,一经查实,立即删除!

相关文章

每日五道java面试题之mybatis篇(二)

目录: 第一题. Mybatis优缺点第二题. Hibernate 和 MyBatis 的区别?第三题. MyBatis编程步骤是什么样的?第四题. 请说说MyBatis的工作原理第五题. MyBatis的功能架构是怎样的? 第一题. Mybatis优缺点 优点 与传统的数据库访问技术相比,ORM…

MySQL中的索引失效情况介绍

MySQL中的索引是提高查询性能的重要工具。然而,在某些情况下,索引可能无法发挥作用,甚至导致查询性能下降。在本教程中,我们将探讨MySQL中常见的索引失效情况,以及它们的特点和简单的例子。 1. **索引失效的情况** …

每日GEE| Day 01 研究区域矢量数据加载

// Add study region var roi ee.FeatureCollection(geometry) Map.centerObject(roi,8); var styling {color:red,fillColor:00000000,width:2};// display hollow roi Map.addLayer(roi.style(styling), {}, "outline"); 以上代码的功能实现了对研究区域的加载&am…

第二十五天-Seaborn数据可视化库

目录 1.介绍 2.使用 1.seaborn官网: 2.安装 3.基础用法 4.导入数据 5.分析基金数据 1.绘制每个月收盘价的趋势线 2.计算涨跌幅 3.设置统计基点 4.分布图:分析涨跌幅数量 5.箱型图 6.回归图 7.热力图 1.介绍 1.与matplotlib区别 2.基于matp…

还看YOLOv8,YOLOv9呢,烂怂卷积有啥好看的?教你利用多模态大模型做目标检测!

文章大纲 大模型业态与idea 来源可行性探索现有成果国内多模态APP 探索利用现有平台进行快速开发 MVP参考文献大模型业态与idea 来源 有一次我在单位汇报的时候,大领导问:深度学习先在还这么落后嘛?每次解决一个问题还要重新训练一个模型࿱

zookeeper快速入门三:zookeeper的基本操作

在zookeeper的bin目录下,输入./zkServer.sh start和./zkCli.sh启动服务端和客户端,然后我们就可以进行zookeeper的基本操作了。如果是windows,请参考前面章节zookeeper快速入门一:zookeeper安装与启动 目录 一、节点的增删改查 …

python之前端css样式(一)

css ID选择器 #c1{color:red;#边框为红色border:1px solid red; } <div id"c2">中国移动</div> 类选择器 .xx{color:blue; } <div class"xx">中国联通</div> 标签选择器 li{color: pink; } <ul><li>北京</li…

reloading,一个很实用的Python库!

Python是一门非常流行的编程语言&#xff0c;它的广泛应用和丰富的第三方库使得开发者们能够轻松完成各种任务。reloading是Python中一个强大的库&#xff0c;它能够在程序运行时重新加载修改过的模块&#xff0c;为开发者提供了便利和灵活性。本文将全面介绍reloading库&#…

SqlServer2008(R2)(二)SqlServer2008(R2)安装和卸载注意事项整理

二、注意事项 1、 安装数据中心版 说明&#xff1a;此激活版仅用于测试和学习使用。 这是官方的下载页面&#xff08;需要付费订阅&#xff09;&#xff1a; http://msdn.microsoft.com/zh-cn/subscriptions/downloads/default.aspx 数据中心版&#xff1a; PTTFM-X467G-P7RH…

实战Python Socket编程:开发多用户聊天应用

实战Python Socket编程&#xff1a;开发多用户聊天应用 Python Socket 编程概述什么是Socket编程&#xff1f;Socket编程的应用场景Socket编程的重要性基本概念 环境准备Python版本必要的库开发环境配置调试工具 基本Socket编程创建Socket绑定Socket到端口监听连接接受连接发送…

【首次抽奖】16G、32G免费送!云服务器选购推荐 京东云 阿里云 腾讯云对比 幻兽帕鲁 雾锁王国 省钱学生党

好消息&#xff1a;抽奖活动开启&#xff01;时间&#xff1a;3月17日——3月24日 最高奖品&#xff1a;16G 6个月&#xff1b;32G 3个月 抽奖规则&#xff1a;B站点赞评论关注即可参与抽奖&#xff0c;3.24日公布获奖名单。 抽奖地址&#xff1a; 【首次抽奖】16G、32G免费…

车载电子与软件架构

车载电子与软件架构 我是穿拖鞋的汉子,魔都中坚持长期主义的汽车电子工程师(Wechat:gongkenan2013)。 老规矩,分享一段喜欢的文字,避免自己成为高知识低文化的工程师: 本就是小人物,输了就是输了,不要在意别人怎么看自己。江湖一碗茶,喝完再挣扎,出门靠自己,四海…

release版本修改exe的图标

大家都知道&#xff0c;在vs中&#xff0c;release版本是可以生成程序的exe执行文件的&#xff0c;意思就是编译之后&#xff0c;直接运行exe文件&#xff0c;即可运行程序&#xff0c;而不用在vs中运行程序。这样就大大的方便了用户使用程序的过程。 但是我们有时候生成的图标…

【go语言开发】性能分析工具pprof使用

本文主要介绍如何在项目中使用pprof工具。首先简要介绍pprof工具的作用&#xff1b;然后介绍pprof的应用场景&#xff0c;主要分为工具型应用和服务型应用。最后数据分析项目&#xff0c;先采集项目信息&#xff0c;再可视化查看 文章目录 前言应用场景工具型应用服务型应用 数…

五、保持长期高效的七个法则(二)Rules for Staying Productive Long-Term(1)

For instance - lets say youre a writer.You have a bunch of tasks on your plate for the day, but all of a sudden you get a really good idea for an essay. You should probably start writing now or youll lose your train of thought.What should you do? 举例来说…

【JS】数组查重

码 /*** 数组查重* param {Array} arr 查重的数组* returns Array 返回不重复的数组 */ const noReArr arr > [...new Set(arr)]const a [12,12,3,4] console.log( noReArr(a) );效果图

鸿蒙Harmony应用开发—ArkTS声明式开发(容器组件:FormLink)

提供静态卡片交互组件&#xff0c;用于静态卡片内部和提供方应用间的交互&#xff0c;当前支持router、message和call三种类型的事件。 说明&#xff1a; 该组件从API Version 10开始支持。后续版本如有新增内容&#xff0c;则采用上角标单独标记该内容的起始版本。 该组件仅可…

Python电梯楼层数字识别

程序示例精选 Python电梯楼层数字识别 如需安装运行环境或远程调试&#xff0c;见文章底部个人QQ名片&#xff0c;由专业技术人员远程协助&#xff01; 前言 这篇博客针对《Python电梯楼层数字识别》编写代码&#xff0c;代码整洁&#xff0c;规则&#xff0c;易读。 学习与应…

leetcode代码记录(不同路径

目录 1. 题目&#xff1a;2. 我的代码&#xff1a;小结&#xff1a; 1. 题目&#xff1a; 一个机器人位于一个 m x n 网格的左上角 &#xff08;起始点在下图中标记为 “Start” &#xff09;。 机器人每次只能向下或者向右移动一步。机器人试图达到网格的右下角&#xff08;在…

后端程序员入门react笔记(八)-redux的使用和项目搭建

一个更好用的文档 添加链接描述 箭头函数的简化 //简化前 function countIncreAction(data) {return {type:"INCREMENT",data} } //简化后 const countIncreAction data>({type:"INCREMENT",data })react UI组件库相关资料 组件库连接和推荐 antd组…