检查嵌套属性在mapStateToProps中是否未定义
在React Redux中，mapStateToProps是一个用于将Redux store中的状态映射到组件props的函数。当我们在mapStateToProps中访问嵌套属性时，需要确保该属性已定义，以避免出现未定义的错误。
为了检查嵌套属性在mapStateToProps中是否未定义，我们可以使用JavaScript中的安全导航操作符（?.）或条件语句进行判断。
- 使用安全导航操作符（?.）： 安全导航操作符（?.）可以在访问嵌套属性时避免出现未定义的错误。它会在属性未定义时返回undefined而不是抛出错误。
const mapStateToProps = (state) => {
const nestedProperty = state?.nested?.property;
// 其他逻辑
return {
nestedProperty,
};
};- 使用条件语句： 我们可以使用条件语句来检查嵌套属性是否未定义，并根据需要进行处理。
const mapStateToProps = (state) => {
let nestedProperty;
if (state && state.nested && state.nested.property) {
nestedProperty = state.nested.property;
}
// 其他逻辑
return {
nestedProperty,
};
};以上两种方法都可以确保在访问嵌套属性时不会出现未定义的错误。根据具体情况选择适合的方法。
关于Redux和React Redux的更多信息，您可以参考腾讯云的产品文档和教程：
- Redux官方文档：Redux
- React Redux官方文档：React Redux
- 腾讯云产品：腾讯云云开发
- 腾讯云产品：腾讯云云函数
- 腾讯云产品：腾讯云API网关
- 腾讯云产品：腾讯云COS对象存储
- 腾讯云产品：腾讯云数据库MySQL版
- 腾讯云产品：腾讯云容器服务
- 腾讯云产品：腾讯云人工智能
- 腾讯云产品：腾讯云物联网开发平台
- 腾讯云产品：腾讯云移动开发平台
- 腾讯云产品：腾讯云区块链服务
- 腾讯云产品：腾讯云游戏多媒体引擎
- 腾讯云产品：腾讯云音视频处理
- 腾讯云产品：腾讯云音视频通信
- 腾讯云产品：腾讯云网络安全
- 腾讯云产品：腾讯云云原生应用引擎
- 腾讯云产品：腾讯云云原生数据库TDSQL
- 腾讯云产品：腾讯云元宇宙
相关·内容
1回答
我运行了一个api并获得了对象的json对象。下面是这个物体的截图。在react本机中，我使用键" data“从redux获取组件中的数据。
当我尝试在mapStateToProps组件中获取城市名称时，我将得到以下错误
TypeError:无法读取未定义属性的“名称”
区块报价
我的mapStateToProps在下面。
const mapStateToProp = ({data}) => {
//console.log(data);
return {
city: data.data.city.name
}
}
我得到完整的数据到城市
浏览 1提问于2018-05-09得票数 0
回答已采纳
以防我们需要一个深度嵌套的道具，并且每个级别的值都可能是未定义的。换句话说，我们需要检查每个级别的值是否未定义。这样做的好做法是什么，或者完全避免这样做？ 一个简单的两级示例，假设深度为5或6... const mapStateToProps = state => {
return {
formValues: state.form.section1 ?
state.form.section1.input1?
state.form.section1.input1.val
浏览 9提问于2019-03-04得票数 0
回答已采纳
我的应用程序使用Redux很长时间了，组件导出如下所示
export default connect(mapStateToProps, mapDispatchToProps)(MyComponent);
我现在正在介绍i18n的翻译库，并希望使用useTranslation中包含的自组织库。
我尝试了几种不同的方法，并且看到Redux有一个connect功能，如果我正确理解，它应该结合HOCs，但是我无法让它工作。
export default connect(useTranslation(), connect(mapStateToProps, mapDispatchToProps))(MyC
浏览 7提问于2022-02-21得票数 0
回答已采纳
嗨，我有一些传递道具到子组件的问题。问题是，将全局状态作为道具发送到子组件可以正常工作，但我不能将本地道具发送到子组件。
我不知道为什么，但它返回undefined。
const mapStateToProps =(state)=>{
return state.itemInfo
}
export class ItemInformationContainer extends React.Component{
componentWillUnmount(){
store.dispatch(hideItemInfo());
}
handl
浏览 1提问于2018-10-03得票数 0
1回答
我正在尝试从我的redux商店呈现一个简单的配置文件。实际上，数据是成功地提供并映射到我的道具上的。我可以在控制台中记录配置文件信息。但是当我呈现概要文件数据时，它告诉我没有定义数据。
当我控制台记录配置文件时，首先显示未定义的配置文件，然后显示数据(见下)。我想知道react是否试图在数据未定义的情况下呈现。
控制台日志
undefined profile.js:28
Object profile.js:28
bio: "Test"
id: 2
image: "ht
浏览 3提问于2020-07-06得票数 0
回答已采纳
我对Redux和React有一个奇怪的问题。状态会正确地更改，并且在mapStateToProps中我也会获得正确的新状态，但是在映射之后，组件将不会重新呈现。
这样，组件就不会重新呈现：
import React, { Component } from 'react';
import { connect } from 'react-redux';
class ListItem extends Component {
render() {
return (<li>{this.props.item.text}</li>
浏览 36提问于2018-06-10得票数 1
回答已采纳
处理React，Redux和Redux-Redux。
订阅正确的存储，但一旦我尝试钻入对象，我就会得到一个‘无法读取属性'x’的未定义。对象中的任何属性都是禁止使用的，因为某些原因使我无法理解。
见守则：
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Link } from 'react-router';
class NavList extends Component {
render() {
浏览 2提问于2017-06-27得票数 0
回答已采纳
我尝试创建一个经过身份验证的路由组件来包装我的react路由，如果登录无效，它会重定向到'/‘路径。我的回答是：
然而，我想访问我的redux商店。如何访问要注入到道具中的loginStatus道具？使用下面的代码，props.loginStatus是未定义的
谢谢
import React from 'react';
import { Route, Redirect } from 'react-router-dom';
import { SUCCESS } from '../common/webUtils';
import { conn
浏览 0提问于2020-06-10得票数 0
我正在开发一个应用程序，它使用axios获取数据，然后将其存储在redux存储中。如果数据可以从api端点获得，那么一切都可以正常工作，但是当我没有数据时，问题就会出现，它会给我错误的解释。
TypeError: props.teamProduct._embedded未定义
这就是我的数据对成功调用的看法。
当我得到未定义的结果时，
这是我的代码
我就是这样从商店里得到team列表的
const mapStateToProps = (state) => {
return {
team: state.productDetails.team.
浏览 2提问于2020-04-07得票数 0
回答已采纳
从状态的分支访问嵌套数据的有效/优雅的方法是什么？
我是新来的反应，这个问题不断出现。我对Redux有一个很好的了解，并且使用诸如Thunk & Saga这样的中间件来编写API，但我仍然不理解编写组件的正确方法，这样它们就不会试图获取不存在的状态。
例如，当用户登录后将用户的配置文件照片加载到标题中时，URL将在redux存储中，因为state.user.userData.photos.primary ...if --当用户未登录时，我尝试访问该位置，userData仍未定义，并将引发错误。所以我的解决方案是写作业，比如：
let profilePhoto = props.user.
浏览 1提问于2018-06-10得票数 1
回答已采纳
我在type中创建了一个TypeScript，它有点复杂(其中包含对象和映射)。
是否有一种方法来检查这种类型是否有任何未定义的值，或者我是否应该遍历其中的每一部分来检查它是否是未定义的？
在这种情况下，typeof会为您服务吗？
浏览 5提问于2022-03-07得票数 0
回答已采纳
我正在尝试让url参数决定哪个‘文章’是加载的。 但是，mapStateToProps会首先触发，并导致出现未定义的文章数据。因此，在触发componentDidMount之前抛出一条错误消息(这就是将文章数据加载到状态中的原因)。我已经尝试将分派放在其他地方(比如在render中或在它自己的方法中)，仍然存在相同的问题。 这是我的comonentDidMount： componentDidMount(){
const params = this.props.location.search.split('/');
this.props.dispatch(g
浏览 18提问于2020-07-28得票数 1
回答已采纳
我将observable-react-project转换为Redux。我有主容器- App.js和他的包含next方法：
handleDone () {
this.setState({ showPLock: false });
}
render () {
return (
<div className="mainContainer">
{this.props.children}
{
this.state.showPLock
浏览 0提问于2016-04-19得票数 1
我想获得userId = idOwner中的所有文档，但是我使用doc()自动生成创建文档
是否有可能以某种方式获取数据数组并将其传递给组件并生成map()？或者确保使用doc(userId)
现在我得到了未定义的项目
let mapStateToProps = ({ firebase, firestore }) => {
return {
userId: firebase.auth.uid,
projects: firestore.data.Projects,
loading: firestore.status.requesting,
fetch
浏览 3提问于2019-11-14得票数 0
回答已采纳
在使用ReactJS、Redux和Firestore时，我在创建新记录时会出现一个错误。但是，我不明白原因，因为我在Redux中正确地获得了更新的信息，但是在创建记录并返回查看所有记录之后，我得到了错误：
TypeError:无法读取未定义的属性“名称”
如果我访问可视化记录，一切都很好，问题是当我生成一个新记录并返回到可视化所有记录时。
我的jSON响应如下：
1:
data: {email: "mail@hotmail.com", lastName: "Asdasd", name: "Oscar"}
uid: "2ts2DopIoX
浏览 0提问于2018-08-26得票数 0
1回答
我正在使用中间件从indexeddb恢复Redux存储。我希望使用根组件中的数据进行路由，以检查用户是否已连接。但是，connect函数似乎没有将根组件state连接到Redux。
在调试时，我看到mapStateToProps从未实际运行。这是index.js的相关部分：
class AppProvider extends Component {
constructor (props) {
super(props)
this.state = {}
}
componentWillMount () {
persistStore(store, {storage
浏览 3提问于2017-05-15得票数 0
1回答
我试图注销一个用户，并显示一个寄存器/登录div或配置文件部分，取决于用户是否登录，我试图在我的主应用程序上呈现的组件上进行此操作。
使用ReduxDevTools，我可以看到，当我登录或不登录用户时，auth状态会发生变化，但是当我尝试呈现LeftContainer设置auth时:得到的auth是未定义的，
错误：
无法读取属性'isAuthenticated‘的未定义警告:失败的道具类型:在LeftContainer中标记为auth是必需的，但它的值是undefined。
LeftContainerProfile/index.js
import React from 'r
浏览 4提问于2017-03-28得票数 1
为什么当我将属性赋值给JSX变量时，它输出为未定义？这是正常的吗？或者，我的程序中是否有其他代码会导致此问题？ const { foo } = this.props;
console.log(this.props);
console.log(foo); ? class Library extends Component {
componentDidMount() {
M.AutoInit();
}
render() {
const { foo } = this.props;
console.log(this.props);
console.
浏览 40提问于2019-06-12得票数 0
回答已采纳
获取reducer中的数据，但无法获取组件中的数据。这是我的连接码。
const mapStateToProps =state => {
return {
name:state.fbLogin.name
}
}
function mapDispatchToProps(dispatch){
return bindActionCreators(ActionCreators,dispatch);
}
export default connect(mapStateToProps,mapDispatchToProps)(Cha
浏览 2提问于2018-06-11得票数 0
我正在尝试使用browserHistory.push以编程方式更改页面。在我的一个组件中，而不是在我嵌入其中的组件中。
有人知道为什么我的项目只为子组件而不是父组件抛出错误吗？
无法读取未定义的属性“push”
父组件
import React, {Component} from 'react';
import { browserHistory } from 'react-router';
import ChildView from './ChildView';
class ParentView extends Component {
浏览 1提问于2017-05-07得票数 37
回答已采纳
1回答
我是包装材料TextField与剩余组件。有些属性应该仅在mapStateToProps中使用，而不是传递给组件本身。否则，我会收到Unknown prop警告。指定未定义的值没有帮助。
function mapStateToProps(state = {}, ownProps) {
var dataKey = ownProps.dataKey;
return {
value: state[dataKey],
dataKey: undefined
}
}
const store = createStore(reducer, {stuff:
浏览 2提问于2016-10-26得票数 3
回答已采纳
我正在用React和Redux，路由器开发应用程序。但是现在我不能将状态设置为'mapStateToProps‘函数的状态。所以减速机的args‘动作’就是‘未定义’。我认为造成这个问题的原因是mapStateToProps的args不是从任何地方传递的。
有人知道如何将状态(来自客户端的数据输入)传递到mapStateToProps函数中吗？
我的mapStateToProps函数就是这样编写的。
const mapStateToProps = state=>{
console.log(state); // this 'state' return undefi
浏览 3提问于2016-12-29得票数 2
回答已采纳
我在Redux Dev工具中调用了我的操作，甚至是新状态，但在实际的组件属性中是未定义的。 组件： import React, { useEffect } from 'react';
import { Link } from 'react-router-dom';
import { connect } from 'react-redux';
import { getPromos } from '../../actions/promo';
import PropTypes from 'prop-types';
c
浏览 13提问于2019-05-20得票数 0
回答已采纳
2回答
我确实有以下变量：
var text = getValue();
getValue() --可以是空的，因此文本===没有定义，可以是===“示例”，也可以是=== "Hello“。
我想检查两件事: 1.如果文本!==未定义，如果文本=== "Hello“
实现这一目标的方法：
if(text !== undefined && text === "Hello World")
variable ：文本变量在两个比较中输入两次。
问题：如何检查两件事(未定义，Hello )，但只使用文本一次？
编辑：我做了一个错误的例子，检查新的变量文本；谢谢！
浏览 2提问于2020-05-11得票数 0
尝试学习反应，但在尝试使用"mapStateToProps“时有问题--它显示错误"TypeError:无法读取未定义的属性‘股票’”
import PropTypes from "prop-types";
class StockList extends Component {
componentDidMount() {
this.props.getStocks();
}
render() {
const { stocks } = this.props.stock;
return (
<Contain
浏览 1提问于2019-01-26得票数 1
回答已采纳
我已经设置了reducers、action和store，它们似乎工作得很好。但是，当我尝试通过this.props访问存储时，我得到了未定义的对象。你知道为什么会发生这种事吗？
Index.js：
class Index extends React.Component {
render() {
console.log("##########################")
console.log(this.props)
this.props.dispatchlog
浏览 0提问于2018-05-30得票数 0
在下面的mapStateToProps中，我想指定一个显式的TypeScript返回类型：
interface CounterProps {
sequence: number;
count: number;
}
class Counter extends Component<CounterProps> {
public static defaultProps = {
sequence: 0,
count: 0
};
public render() {
const sequence = t
浏览 14提问于2019-08-16得票数 3
回答已采纳
3回答
我的店：
store={
users: [
{id:1},
{id:2},
{id:3}
]
}
现在，我只想导入一个用户的基础上的路线仿冒。
id = this.props.match.params.user_id;
问题是..。如何在mapStateToProps函数从我的存储区获取数据之前建立上面的id变量？我的mapStateToProps：
return {
singleUser: state.users[id]
};
返回未定义的。我尝试在mapStateToProps中放置变量'id‘，但我认为当它开始获取数据时，参数还没有建立。
编辑
浏览 0提问于2019-04-16得票数 1
回答已采纳
我想使用从mapStateToProps获得的属性来设置组件的本地状态。当我在ComponentWillMount()方法或ComponentDidMount()方法中使用this.setState时，它是未定义的。
componentWillMount() {
this.props.fetchBooks(this.props.id);
this.setState({
books:this.props.books
})
}
const mapStateToProps = (state, ownProps) => {
let id = ownPr
浏览 0提问于2019-10-03得票数 0
2回答
我将张贴代码，并在最后提出问题。
SignUpScreen.js
export default class SignUpScreen extends Component {
constructor(props) {
super(props);
}
validateConfirmationPassword() {
const { username } = this.props;
console.log("TEST >> " + username);
}
render() {
const { username, password, email,
浏览 0提问于2018-11-13得票数 0
回答已采纳
我可以点击编辑评论，这将带我到评论编辑页面的价值，该评论。问题是，如果我点击刷新，它会破坏页面，并得到未定义的错误注释。现在我知道这是因为国家已经被消灭了，但是有什么办法可以让我等着州负荷进来吗？
更新:我已经修复了页面在刷新时中断的问题，但是我无法获得来获取注释值。我不确定以后是否有一种方法来设置状态值。我得到了诸如author未定义和_id未定义的东西，我知道这是因为我将commentValue设置为{}。我的问题是，当状态得到正确更新以获得这些值时，是否有一种方法？
下面是检查的代码：
function mapStateToProps({ posts, auth, user }, own
浏览 8提问于2017-07-06得票数 2
回答已采纳
因此，我很乐意将React与connect()、HOC和mapStateToProps一起使用，它工作得非常好。然而，似乎在组件生命周期的开始阶段，Redux连接的道具并没有初始化。在组件生命周期中，是否有一个特定的点可以将基于mapStateToProps的属性视为已初始化并等于存储中的值？
浏览 16提问于2019-10-07得票数 2
2回答
在我的react应用程序中，我经常从API中获取数据，这给我的组件无法呈现数据留下了一些时间。从我的研究中，我现在了解到，如果您传递未定义的，将使用defaultProps，但如果传递null，则忽略defaultProps。
按照我的代码当前的结构方式，组件中有defaultProps，但是它的父程序在加载数据时传递null，所以我还是要检查所有内容。
手动传递未定义的值以触发defaultProps (在获取数据的上下文中)是否更有意义？
同样，这也适用于我的redux选择器(mapStateToProps)吗？
例如：
<Component bedrooms={bedrooms |
浏览 1提问于2018-05-22得票数 4
回答已采纳
我的职能是：
const mapStateToProps = function(state){
return {
products: state.products
}
};
商店是这样的：
var store = {
products: [1,2,3]
};
当我在连接组件中使用this.props.products时，是否仍然需要这样做：
var products = this.props.products.slice();
若要复制，或已复制，请执行以下操作。
浏览 0提问于2017-03-17得票数 2
回答已采纳
2回答
我正在使用firestoreConnect()将我的数据与redux从火药库同步。
我正在通过state.firestore.ordered从火药库得到一个雇员对象数组。
雇员的形状是这样的：
{ id：‘XtVe567.’，名称：{ first：'John'，最后一个：'Doe‘}}
在mapStateToProps中，在返回数据并通过道具将其传递到组件之前，我需要转换数据的形状。
函数mapStateToProps(state) { const调度= state.firestore.ordered.employees .map(employee =&
浏览 0提问于2019-03-30得票数 0
回答已采纳
我有一个index.js，它呈现数据库中的所有表。
_renderAllTables() {
const { fetching } = this.props;
let content = false;
if(!fetching) {
content = (
<div className="tables-wrapper">
{::this._renderTables(this.props.allTables)}
</div>
);
}
return (
<section>
<hea
浏览 0提问于2016-11-14得票数 2
回答已采纳
我正在为我的应用程序使用react和redux。我的问题是我收到了2次道具，第一次是未定义的，第二次是好的。所以我不能使用道具。
import ...
class Home extends Component {
//some code logic
render(){
console.log(this.props.header);
const header = this.props.header;
return (
<Welcome title={header.title} />
)
}
}
const
浏览 4提问于2017-03-13得票数 1
您好，我是新的反应和redux，我试图访问存储从componentDidMount方法，但总是给我未定义，当控制台的状态从mapActionToState第一次给我未定义，然后给我真实的状态 import React, {Component} from 'react'
import {connect} from "react-redux";
class UserProperties extends Component {
constructor(props) {
super(props);
this.state = {
tab
浏览 22提问于2019-03-21得票数 0
是否有一种简单的方法来检测Rails中是否存在XML节点？
若要获取我使用的@result实例变量，请执行以下操作
response, data = Net::HTTP.post_form(url, params)
@result = Hash.from_xml(response.body)
我试过：
if @result['GetProperties']['Errors'].exists?
或者只是
if @result['GetProperties']['Errors']
但两者都会导致以下错误：
零的未定义方法‘[]：Nil
浏览 3提问于2014-01-06得票数 1
嗨，我刚开始反应和还原，我有以下问题，将clientName属性添加到mapStateToProps中的提议数组会给我以下错误："TypeError:无法读取未定义的属性‘名称’“，我尝试了很多事情，但我真的找不到解决方案。
const ProposalsPage = ({ proposals, clients, loading, loadProposals,loadClients }) => {
useEffect(() => {
if (proposals.length === 0) {
loadProposals().catch((error)
浏览 0提问于2021-02-22得票数 0
回答已采纳
我是新来的。我已经通过mapStateToProps传递了一个值，而this.props在render()中有值。但是，如果我像下面的示例中的this.props函数一样在函数中控制台renderRow，那么它会给出未定义的结果。为什么是这种情况？
constructor() {
super();
}
renderRow(rowData) {
//this.console gives undefined why
console.log('props1', this.props);
}
render() {
//this.props has v
浏览 0提问于2018-10-28得票数 0
回答已采纳
2回答
类型操作符未按预期操作。
、、、、
我试图检查特定的javascript对象是否存在。
var success = function(data) {
var x= 0;
var numOfCards = data.length;
for (x=0;x<data.length - 1;x++)
{
if (typeof data[x].labels[0].name !== 'undefined')
{
alert("Object Exists");
浏览 2提问于2016-05-05得票数 1
为什么函数mapStateToProps在React/Redux中返回“未定义”或空对象。
我的代码：
import React from 'react'
import {connect} from "react-redux";
export const ArticleComponent = ({props}) => (
<div>
<h1>Hello {console.log(props)}</h1>
</div>
);
const mapStateToProps = (state) =>
浏览 2提问于2018-07-03得票数 0
因此，我试图通过路由传递params到react组件，同时也使用组件类道具。下面是我在做的事情
import { loadSchemes, } from '../../actions/schemes;
export class Schemes extends Component {
constructor(props) {
super(props);
const { match: { params } } = this.props;
this.state = {
client_id: params.pk,
}
}
componentDi
浏览 5提问于2020-05-30得票数 0
组件在挂载之前不会从Firebase检索数据。
const mapStateToProps = (state, ownProps) => {
return {
products: state.firestore.ordered.products
};
};
当我在它安装后测试道具时...
componentDidMount() {
console.log(this.props);
}
this.props.product的值未定义。
如果我在mapStateToProps()中定义状态参数，我会立即得到两个未定义的console.logs，过了一会儿，我就会得到
浏览 42提问于2019-04-19得票数 1
回答已采纳
我有一个基于类的仪表板组件
class Dashboard extends Component {
...
render() {
return sth
}
}
const mapStateToProps = state => ({
userId: state.mainState.userId,
theme: state.mainState.theme,
companyUsers: state.mainState.companyUsers,
activities: state.mainState.activities,
activityTypes: sta
浏览 1提问于2021-04-07得票数 0
回答已采纳
每当我试图映射一个成分数组时，我都会得到这个错误。
这是配料数组
ingredients": [
"2 jalapeno peppers, cut in half lengthwise and seeded",
"2 slices sour dough bread",
"1 tablespoon butter, room temperature",
"2 tablespoons cream cheese, room temperature",
"1/2 cup jack and cheddar
浏览 0提问于2018-11-30得票数 0
回答已采纳
1回答
我想创建一个检查用户是否已经登录的高阶组件。如果它们有，我会显示组件，如果没有，我希望将它们重定向到登录页面。
有人能解释一下我做错了什么吗？
这是一个特别的例子：
import React from 'react';
import { connect } from 'react-redux';
const withAuthentication = (Component) => {
class WithAuthentication extends React.Component {
componentDidMount() {
co
浏览 5提问于2018-11-25得票数 3
2回答
我正在从API中获取数据，以根据API值显示图像。如果对象中有图像，则下面的代码可以完美地工作。如果API项没有图像，应用程序会抛出“未定义的不是对象”错误。
<View>
<Image source={{uri:props.enclosures[0].url}} style={styles.mainPhoto} />
</View>
我尝试了下面的代码来检查值是否首先存在，但如果API项没有图像，它仍然会抛出完全相同的错误。
<View>
{props.enclosures[0].url ?
<Image source={{uri:p
浏览 0提问于2019-10-25得票数 1
我的mapStateToProps函数
const mapStateToProps = (state, props) => ({
object: {},
criteria: []
});
它包含两个属性：
object 1. property
它从对应URL的对象id的存储中获得一个对象。
生成的对象如下所示：
{
object: {
id: 42,
criteria: [1, 2, 3]
}
}
criteria 2. 属性
这个应该从存储中获取条件对象，其中包含以前获取的对象的条件id的id。
我想出了以下功能：
const mapStateT
浏览 11提问于2017-05-19得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
