dva使用心得

组件在异步数据到来前已经完成初始化,是导致constructor中无法取到所需数据的原因。所以最直接的方法,就是修改组件创建的时间

//把原来的组件内部控制显示
/* <ComponentName show={modelName.show}/> */
//更改为状态直接控制组件是否存在
{
  modelName.show && <ComponentName/>
}
//或者
{
  modelName.show ? <ComponentName/> : null
}

//或者更严谨一点
//由于项目中加入了用户数据获取失败,需重新登录,所以也就没有加上后面这个
{
  modelName.show && modelName.needData && <ComponentName/>
}

目标组件不会在页面加载时就初始化

而是在用户点击控制按钮,需要使用组件时,才初始化

 问题and心得:

1.初始化数据是怎么执行的。

2.connect怎么传输数据的。

3.什么时候写全局model,什么时候写局部model。

4.什么时候会是同步,什么时候使用同步。

5.能否使用@connect({sms})来把model层的数据传递到当前组件。通过this.props.sms可以获取到model里sms.js中的state数据)

6.流程:dispatch时候models里面的effect,models中的effect会yield call已经import进来的service里面的action,然后service里面,action会调用request,把url和数据传输给后台,然后在models里面yield完毕后,能获取到responce传过来的数据。

7.model相当于vue的vuex,里面包含了但向数据流的所有的控制

8.在vue中我们一般定义一个全局的头部标题字段,并且在mounted中调dispatch改变,但在dva的model中这段分为了两个部分,其中effects是异步修改数据时调用的, 也就是在react的componentDidMount的生命周期里面需要调用的是异步的effects的action,但如果是用户操作的某个方法是,可以直接调用reducers里面的action

9、注意如果在组件中要调用dispatch的话,必须导入connect,并且注入,才可以调用,不然会报不存在的方法

10、dva规定比较强制,如果你是异步的方法必须调用effects的action,绝对不能调用同步的reducers,否则会报错,但同步的操作可以调用异步的effects,但因为是异步的操作,数据有时不会直接变过来,如果是操作的话,建议用reducers的同步

11.call:执行异步函数(以异步的方式调用函数)

put:发出一个 Action,类似于 dispatch

select:从state中获取相关的数据

take 获取发送的数据

12.需要数据时,是否需要在componentDidMount里面去请求。

13.query是请求的哪儿

14.延迟加载

1.能否使用@connect({sms})来把model层的数据传递到当前组件。通过this.props.sms可以获取到model里sms.js中的state数据)

 

2.流程:dispatch时候models里面的effect,models中的effect会yield call已经import进来的service里面的action,然后service里面,action会调用request,把url和数据传输给后台,然后在models里面yield完毕后,能获取到responce传过来的数据

@font-face { font-family: "Times New Roman"; }@font-face { font-family: "宋体"; }@font-face { font-family: "Calibri"; }p.MsoNormal { margin: 0pt 0pt 0.0001pt; text-align: justify; font-family: Calibri; font-size: 10.5pt; }span.msoIns { text-decoration: underline; color: blue; }span.msoDel { text-decoration: line-through; color: red; }div.Section0 { }

转载于:https://www.cnblogs.com/zz-zrr/p/9681152.html

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

html右缩进怎么设置,WPS中怎么设置右缩进两个字符?

回答&#xff1a;打开我们的Word文档&#xff0c;调整好我们的文字内容&#xff0c;然后全选我们的文字内容&#xff0c;注意要分段时按下键盘上的回车键另起一行。请点击输入图片描述接着&#xff0c;我们点击顶部菜单栏的“开始”菜单&#xff0c;在开始菜单下面的子菜单中找…

VS2013专业版+QT5.6.3+qt-vs-addin-1.2.5环境搭建

一、工具资料&#xff1a; 1.vs2013专业版地址&#xff1a;http://download.csdn.net/download/u010368556/10238145 2.qt各版本地址&#xff1a;http://download.qt.io/archive/qt/ 3.qt-vs插件地址&#xff1a;http://download.qt.io/archive/vsaddin/ 二、环境搭建过程&…

不到50行代码实现一个能对请求并发数做限制的通用RequestDecorator

使用场景 在开发中&#xff0c;我们可能会遇到一些对异步请求数做并发量限制的场景&#xff0c;比如说微信小程序的request并发最多为5个&#xff0c;又或者我们需要做一些批量处理的工作&#xff0c;可是我们又不想同时对服务器发出太多请求&#xff08;可能会对服务器造成比…

使用ActiveMQ和HornetQ通过WebSocket通过STOMP轻松进行消息传递

消息传递是用于构建不同级别的分布式软件系统的极其强大的工具。 通常&#xff0c;至少在Java生态系统中&#xff0c;客户端&#xff08;前端&#xff09;从不直接与消息代理&#xff08;或交换&#xff09;进行交互&#xff0c;而是通过调用服务器端&#xff08;后端&#xff…

yum 安装mysql的位置_Yum安装MySQL以及相关目录路径和修改目录

有些时候,为了方便,有些同学喜欢通过yum的方式安装MySQL,没有设置统一的文件目录以及软件目录,那么就会为后续的维护工作带来很大的麻烦&#xff01;下面就简单介绍一下yum安装MySQL的步骤以及这类安装下的相关目录路径,最后简单介绍下如何更改文件目录&#xff01;YUM安装MySQ…

【laravel】【转发】laravel 导入导出excel文档

1、简介 Laravel Excel 在 Laravel 5 中集成 PHPOffice 套件中的 PHPExcel &#xff0c;从而方便我们以优雅的、富有表现力的代码实现Excel/CSV文件的导入和 导出 。 该项目的GitHub地址是&#xff1a; https://github.com/Maatwebsite/Laravel-Excel 。 本文我们将在Laravel中…

javaScript--DOM

一、JavaScript JavaScript这门语言由 DOM、BOM、ECMAScript 组成。 DOM&#xff1a;document object model 文档对象模型。体现在代码中就是 document 对象。 BOM&#xff1a;browser object model 浏览器对象模型。体现在代码中就是window对象。 ECMA&#xff1a;核心语法。包…

计算机原理及应用课程,课程介绍

《计算机原理及应用》课程的计划学时为70学时&#xff0c;其中课堂授课为58学时&#xff0c;课程实验为12学时。另外&#xff0c;还设置了2周课程综合性实验。三、教学内容(一)理论教学《计算机原理及应用》的课程内容共分为9部分&#xff0c;其具体内容、知识点和课时分配如下…

你真的了解css像素嘛?

在日常开发中&#xff0c;px一定是大家接触过最多的css单位&#xff0c;但是你真的了解px嘛&#xff1f;1px在屏幕中到底是多大呢&#xff1f;另外不知道大家有没有过下面这些疑惑: 为什么一个元素在pc上和移动端的物理尺寸不一样&#xff0c;但是两者的视觉效果上却差不多呢&…

Apache Camel 2.12 –支持后退,以减少较积极的轮询路线

这是另一篇博客文章&#xff0c;介绍了下一个Apache Camel 2.12版本中即将进行的改进和新功能。 在上一个博客中&#xff0c;我谈到了路由直接支持的cron表达式 。 这篇博客文章与之相关&#xff0c;因为我们对轮询路由具有另一个新功能&#xff08;使用计划的轮询使用者&…

django框架概述

------------------MVC与MVT框架------------------- 1、MVCMVC框架的核心思想是&#xff1a;解耦。降低各功能模块之间的耦合性&#xff0c;方便将来变化时&#xff0c;更容易重构代码&#xff0c;最大程度上实现代码的重用。m表示model&#xff0c;重要用于对数据层的封装&am…

小鬼难缠--python小bug备忘

今天编译pyhon做人脸识别&#xff0c;遇到几个问题&#xff0c;做个记录吧。 编译报错&#xff1a; File "harrClassifier.py", line 17, in <module> flagscv2.CV_HAAR_SCALE_IMAGEAttributeError: module object has no attribute CV_HAAR_SCALE_IMAGE 定位根…

mysql for mac中文_mysql for Mac 下创建数据表中文显示为?的解决方法

在我的绝版Mac mini下安装了mysql 5.7版本&#xff0c;实例中&#xff0c;在通过load data 导入数据时发现表中的中文显示为 &#xff1f;通过百度&#xff0c;发现多个版本的解决方法&#xff0c;将其中一个成功解决的方法贴上来&#xff1a;大多方法都是这样&#xff1a;需要…

计算机科学计算方面分为,计算机方面的专业分为哪些类?【资讯与计算科学】和【电脑科学与技术专业】有什么不同?...

计算机方面的专业分为哪些类&#xff1f;【资讯与计算科学】和【电脑科学与技术专业】有什么不同&#xff1f;以下文字资料是由(历史新知网www.lishixinzhi.com)小编为大家搜集整理后发布的内容&#xff0c;让我们赶快一起来看一下吧&#xff01;计算机方面的专业分为哪些类&am…

Java异常处理教程(包含示例和最佳实践)

异常是可能在程序执行期间发生的错误事件&#xff0c;它会破坏其正常流程。 Java提供了一种健壮且面向对象的方式来处理异常情况&#xff0c;称为Java异常处理 。 我们将在本教程中研究以下主题。 Java异常处理概述 异常处理关键字 异常层次 有用的异常方法 Java 7自动资源…

GMTC 大前端时代前端监控的最佳实践

本文来自阿里云前端监控团队&#xff0c;转载请注明出处本文为2018年6月21日&#xff0c;在北京举办的GMTC(全球大前端技术大会)&#xff0c;下午性能与监控专场&#xff0c;由阿里云前端监控团队前端技术专家彭伟春带来的演讲稿&#xff0c;现场反馈效果非常好&#xff0c;地上…

mysql有子查询么_sql-带有子查询的mysql更新查询

谢谢&#xff0c;我不知道使用INNER JOIN进行更新。在原始查询中&#xff0c;错误是要命名子查询&#xff0c;该子查询必须返回一个值&#xff0c;因此不能使用别名。UPDATE CompetitionSET Competition.NumberOfTeams (SELECT count(*) -- no column aliasFROM PicksPointsWHE…

『性能测试』文章大汇总

为了方便阅读&#xff0c;我重新整理本文&#xff0c;将包含本博客所有与性能测试有关的内容。 ------------------------------------------- 近两年市面上的性能测试书籍很多了&#xff0c;但大部分书都在讲loadrunner的操作技巧项目与项目实践。我不认为有什么问题&#xff…

Alpha阶段敏捷冲刺②

1.提供当天站立式会议照片一张 每个人的工作 &#xff08;有work item 的ID&#xff09;&#xff0c;并将其记录在码云项目管理中&#xff1a; 昨天已完成的工作。 购买云服务器 注册账号 界面布局初步规划 今天计划完成的工作。 界面雏形设计 数据库初步设计 完成后端框架初步…

html iframe post,使用Jquery和IFrame的跨子域请求(GET,POST,…)

我正在尝试在我的主域(http://foo.com)和我的API(http://api.foo.com)之间开发请求.为了绕过关于跨子域内容的限制,我在主页(http foo.com/main.html)上使用iframe,指向iframe.html页面&#xff1a;scripts.api.foo.com.(scripts.api.foo.com和foo.com在同一台服务器上,api.foo…