Warning: Cannot update a component from inside the function body of a different component

原創 BennyShi98 2020-04-20 16:14

React Hook使用的坑，不可以把子組件的的state A通過props函數傳參返回上父組件，再使用 state A 設置父組件的 state B。這樣React Hook的diff算法會報錯。

 

子組件：

父組件：

就會出現warning：

 

解決方法就是間接通過變量傳子組件的state的值。不能直接傳組件中state值

發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章

React+Spring Data JPA+MySQL 增查改刪

視頻演示: https://www.bilibili.com/video/BV1La4y1a7Rp/ 工程概述: 前後端分離，進行簡單增查改刪（CRUD） 前端使用React 後端使用Spring Data JPA 數據庫使

wenhaipan 2020-07-07 18:27:37

web前端開發新手應該知曉的20件事

在我當初剛從事 web 開發的時候，有很多重要的事我並沒有事先了解。現在看來，我的很多期望都和現實有很大的差距。在這篇文章裏，我會告訴你 20 件事情，這些都是在你準備開始或者剛開始 web 開發不久的時候就應該知曉的。這有助於你更好地正視

原創 2023-10-10 11:11:54

createBottomTabNavigator

createBottomTabNavigator createBottomTabNavigator相當於iOS裏面的TabBarController，屏幕下方的標籤欄。如圖： createBottomTabNavigator API

不負好時光 2023-07-09 11:15:05

從零開始，搭建React項目，篇一（搭建react項目、在react項目中使用Sass、react-router-dom、antd）

一、創建項目 注意： 創建項目的時候，記得暴露配置文件 （ npm run eject 或者 yarn run eject ） 因爲暴露配置的文件的操作不可逆，之前沒有提及git的話，可能會報錯，還需重新git add . ；

ddx2019 2020-07-08 11:55:42

React 組件淺析

React 組件 文章目錄React 組件一.聲明組件1.ES5寫法:React.createClass()2.ES6寫法:React.Component3.函數式組件二.組件注意事項1.組件名首字母大寫2.一個根元素3.retu

Lechar0327 2020-07-08 09:41:33

VSCode React JSX Tab鍵快速生成標籤對 配置方法

Intro emmet是前端 標籤代碼塊 形式代碼書寫的利器。 而在VSCode中，默認有emmet的擴展。 JSX是React語法中，用於快速組裝標籤代碼塊的一種寫法。 但是一般情況下需要配置纔可以使用(不屬於HTML原

软件工程本科生 2020-07-08 09:38:43

React中createContext和useContext的使用-實例

在demo中，我可以通過全局組件傳遞一個屬性改變按鈕的顏色，當父組件改變color顏色時，子組件也隨之改變顏色 當組件上層最近的 <MyContext.Provider> 更新時，該 Hook 會觸發重渲染，並使用最新傳遞給 M

juan_taylor 2020-07-08 09:00:51

說好的精通React框架，這些技巧學到家了嗎（上）

動態綁定className 原理：通過三元表達式控制className值。 render(){ const flag=true return ( <div className={flag ? "active" : "no-

椰卤工程师 2020-07-08 08:39:03

npm鏡像地址

npm鏡像地址 https://registry.npm.taobao.org http://registry.cnpmjs.org 清除已有的鏡像地址 npm config delete registry

CoocleC 2020-07-07 15:12:20

react-redux管理數據在使用ant.design使用Upload上傳圖片時，無法渲染圖片！

1、背景： 使用react-redux管理數據，在使用Upload上傳時，單獨開闢預覽區域，使用thumbUrl展示預覽圖片，在state更新後，dom有時可以更新，有時更新不了。 2、原因： Upload組件在onChange事件中，

plia 2020-07-07 13:42:25

閱讀react-redux源碼(二) - createConnect、match函數的實現

閱讀react-redux源碼 - 零 閱讀react-redux源碼 - 一 閱讀react-redux源碼(二) - createConnect、match函數的實現 上一節看了Provider組件的實現，主要做的事情就是

葡萄糖o_o 2020-07-07 11:53:44

react-js將時間字符串轉換爲時間戳進行時間比較

1、在我們需要進行時間比較時，獲取的是字符串形式的時間，需要和時間格式進行比較。這時候我們需要將時間兩種形式都轉換爲時間戳來進行比較。 具體時間戳怎麼定義的我也不清楚，但百度百科中有這麼一句：“時間戳是自 1970 年 1 月 1

WebViewSuper 2020-07-07 10:12:18

react 報錯You should not use xx outside a 「Router」

不能將使用了react-router-dom的組件暴露在BrowserRouter之外 解決:將組件放在BrowserRouter內 代碼示例: import React,{Component} from 'react' im

神奇大叔 2020-07-07 06:46:06

react 使用mock.js模擬後臺數據

1、cnpm install mockjs -S 2、在index.js引入mock.js文件 判斷是否是生產環境 if(process.env.NODE_ENV=='development') { requir

神奇大叔 2020-07-07 06:46:06

react 自定義json數據模擬後臺

1、在public目錄下創建json文件 如:public/api/data.json 2、在json文件中自定義數據 3、當請求url爲'api/data.json'時,會自動去到public目錄下查詢,並返回json內

神奇大叔 2020-07-07 06:46:06