繁体   English   中英

组件 state 从 function 切换到渲染组件

Component state switching from function to render component

提示:本站收集StackOverFlow近2千万问答,支持中英文搜索,鼠标放在语句上弹窗显示对应的参考中文或英文, 本站还提供   中文繁体   英文版本   中英对照 版本,有任何建议请联系yoyou2525@163.com。

我目前正在尝试在我的渲染方法中使用从 api 收到的一些数据。 我在 componentDidMount 中调用 function。 这是 function:

 getDataFromDb = () => {
        axios.get(this.props.urlFromParent + "GetCurrentPods/Device1")
            .then( (res) => {
                this.setState({
                    Pods : res.data
                })
                console.log(this.state.Pods)
            })
 };

我在我的渲染方法中这样调用它

{console.log('hello'+ this.state.Pods)}

这是 console.log 输出:

hello[object Object]
Array [
Object {
    "ParentDeviceID": "Device1",
    "ParentDeviceIsActive": true,
    "PodIsActive": true,
    "PodLocation": 5,
    "PodType": 2,
    "__v": 0,
    "_id": "5d6bfe9c50a6c33006cbd6ac",
},
]

我无法弄清楚为什么 state 在渲染方法中返回 object Object。 我也收到错误:警告:在现有的 state 过渡期间无法更新(例如在render中)。 渲染方法应该是纯 function 的道具和 state我不确定这是否与我的问题有关。 谢谢你的帮助。

1 个回复
console.log('hello'+ this.state.Pods)

当您将字符串“hello”与 object “this.state.Pods”连接时,上述行会将 object 转换为字符串。 您应该使用,或两个控制台语句以不同方式记录 hello 和 this.state.Pods。

2 Function 组件在渲染中始终使用以前的 state

我对使用钩子和功能组件很陌生。 我有一个过滤列表。 当我尝试更新过滤器时,它将使用最后一个过滤器 state 而不是新的过滤器。 我一定错过了一些渲染/状态更改命令,但我似乎无法弄清楚它是什么。 我很感激我能得到的任何帮助:) 伪代码如下: ...

3 从子功能渲染组件

我对React有点新手,所以我什至不确定我在寻找什么,但这是我的问题: 我已经创建了一个顶部导航栏,所有页面都必须存在,但是每个页面都需要用不同的内容“填充”导航栏,我只希望呈现不同的内容,而不是在和上方重新渲染导航栏。再次。 这是app.jsx中的导航条代码: 我想创 ...

2017-09-23 09:02:32 2 51   reactjs
4 从渲染中的 function 返回组件

我正在尝试从渲染 function 中的另一个文件返回一个组件。 有问题的 function 是 AccessibleTable。 如果我直接在渲染中返回 function 是可能的,如下所示: 如果我确实喜欢这个,我会收到错误 在渲染中: function: 可访问表: 如何从 function ...

2021-03-15 10:37:39 1 132   reactjs
5 从组件中的 function 渲染值

我在 React 中有一个这样的组件: 我希望将 function myAge的结果返回并呈现在p标记中,但没有呈现任何内容。 我不知道我做错了什么,有什么建议吗? 泰。 ...

2021-04-11 21:57:42 1 18   reactjs
6 state 组件的 function 组件

我想将 function 组件重写为 state 组件。 我对 useCallback 有疑问。 请帮忙。 组件 function: class 组件: ...

2020-05-02 17:56:25 1 20   reactjs
7 使用Router切换组件时,多次渲染方法调用函数

在开发第一个ReactJS应用程序的过程中,我注意到在某些情况下,当我使用Router链接切换到其他组件时,render方法会多次调用该函数。 我不确定这是否正确,或者就编码标准而言这是错误的。 以下示例案例: 组件1-主页组件2-电视 步骤1 :应用程序加载了主页,然后我移 ...

9 无法将数据从状态渲染到 React 组件

我正在尝试调用 Firebase 并以 JSON 的形式获取数据,然后将 JSON 数组的对象传递给其他一些 react-native 组件。 我能够成功调用 Firebase,然后获取 JSON 对象数组。 然后我将该 JSON 对象列表存储在 STATE 变量中,然后尝试将对象一个一个地传递给 ...

10 警告:渲染方法应该是 props 和 state 的纯函数; 不允许从渲染触发嵌套组件更新

**大家好,我有一个 react.js 应用程序,它必须根据点击链接制作三个不同的组件,第一个组件是注册表,第二个是登录表单,最后一个是幻灯片,默认情况下必须显示 s . 我的问题是,如果我单击登录,它会很好地显示表单,但会在控制台中显示此警告:“警告:渲染方法应该是道具和状态的纯函数;不允许从渲 ...

2020-11-18 23:43:43 1 2376   reactjs
暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2022 STACKOOM.COM