Javascript 如何在正在使用的同一组件中访问MapStateTops？

我有以下代码示例：

        import React, {Component} from 'react'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import {connect} from 'react-redux'
import axios from '../../axios'

import classes from './List.module.css'
import {Button,ListGroup} from 'reactstrap'
import Input from '../UI/Input/Input'
import Items from './Items/Items'


class List extends Component{

    componentWillMount() {
        axios.get('/list/items.json')
        .then(response=>{
           console.log("response.data")
           console.log(response.data)
           this.props.initialState(response.data)
        }).catch(error=>console.log(error))
      }

    render(){
        let inputElement = null
         if(this.props.input){
             inputElement=(
                <Input 
                changedName={this.props.changedName}
                changedDesc={this.props.changedDesc}
                addOrEdit={this.props.addItem}
                nameInput={this.props.state.nameInput}
                descInput={this.props.state.descInput}
                buttonText={this.props.state.buttonText}/>
             )
         } 

         let editElement = null
         if(this.props.state.edit){
            editElement=(
                <Input 
                changedName={this.props.changedName}
                changedDesc={this.props.changedDesc}
                addOrEdit={this.props.editItem}
                nameInput={this.props.state.nameInput}
                descInput={this.props.state.descInput}
                buttonText={this.props.state.buttonText}/>
             )
         }

         let itemElement = null

         if(this.props.items && this.props.items.length !== 0 ){
             itemElement = this.props.items.map((i,index)=>{
                 return <Items
                        className={classes.items}
                        id={index}
                        name={i.itemName}
                        key={index}
                        deleteClicked={()=>this.props.deleteItem(index)}
                        itemIndex={()=>this.props.itemIndexChanger(index)}
                        editInput={()=>this.props.editItemHandler(index)}
                        editIndex={this.props.state.editIndex}
                        editElement={editElement}/>
             })
         }else{
             itemElement = <h4 className={classes.items}>Please add an Item</h4>
         }

        return(
            <div className={classes.items}>
                <ListGroup> 
                    {itemElement}
                </ListGroup>
               <hr className={classes.hr}/>
                <Button 
                className={classes.button}
                onClick={this.props.toggleInputHandler} 
                size="sm"
                outline color='info'>
                    Add Items 
                    <FontAwesomeIcon icon='plus'/>
                </Button>
                {inputElement}
            </div>
        )
    }
}

const mapStateToProps = (state) =>{
    return{
        items:state.items,
        input:state.input,
        state:state
    }
}

function fetchData(){
    console.log(this.props.state)
}


const mapDispatchToProps = dispatch=>{
    return{
        toggleInputHandler:()=>dispatch({type:'TOGGLE_INPUT_HANDLER'}),
        changedName:(event)=>dispatch({type:'CHANGED_NAME', payload:event.target.value}),
        changedDesc:(event)=>dispatch({type:'CHANGED_DESC',payload:event.target.value}),
        addItem:()=>{return(dispatch({type:'ADD_ITEM'}))},
        deleteItem:(index)=>dispatch({type:'DELETE_ITEM',index:index}),
        editItemHandler:(index)=>dispatch({type:'EDIT_ITEM_HANDLER',index:index}),
        editItem:()=>dispatch({type:'EDIT_ITEM'}),
        itemIndexChanger:(index)=>dispatch({type:'CHANGE_ITEM_INDEX',index:index}),
        initialState:(value)=>dispatch({type:'SET_STATE',payload:value})
    };
}

export default connect(mapStateToProps, mapDispatchToProps)(List)

import React，{Component}来自“React”
从'@fortawesome/react fontawesome'导入{FontAwesomeIcon}；
从“react redux”导入{connect}
从“../../axios”导入axios
从“./List.module.css”导入类
从“reactstrap”导入{按钮，列表组}
从“../UI/Input/Input”导入输入
从“./Items/Items”导入项目
类列表扩展组件{
组件willmount（）{
get（'/list/items.json'））
。然后（响应=>{
console.log（“response.data”）
console.log（response.data）
this.props.initialState（response.data）
}).catch（错误=>console.log（错误））
}
render（）{
让inputElement=null
if（此.props.input）{
输入元素=(
)
} 
让editElement=null
if（this.props.state.edit）{
编辑元素=(
)
}
设itemElement=null
if（this.props.items&&this.props.items.length！==0）{
itemElement=this.props.items.map（（i，索引）=>{
返回此.props.deleteItem（索引）}
itemIndex={（）=>this.props.itemIndexChanger（index）}
editInput={（）=>this.props.editItemHandler（索引）}
editIndex={this.props.state.editIndex}
editElement={editElement}/>
})
}否则{
itemElement=请添加一个项目
}
返回(
{itemElement}

添加项目
{inputElement}
)
}
}
常量mapStateToProps=（状态）=>{
返回{
项目：state.items，
输入：state.input，
州：州
}
}
函数fetchData（）{
console.log（this.props.state）
}
const mapDispatchToProps=调度=>{
返回{
toggleInputHandler:（）=>dispatch（{type:'TOGGLE\u INPUT\u HANDLER'}），
changedName：（event）=>dispatch（{type:'CHANGED_NAME'，payload:event.target.value}），
changedDesc:（event）=>dispatch（{type:'CHANGED_DESC'，payload:event.target.value}），
addItem:（）=>{return（dispatch（{type:'ADD_ITEM'}））}，
deleteItem：（index）=>dispatch（{type:'DELETE_ITEM'，index:index}），
editItemHandler:（index）=>dispatch（{type:'EDIT_ITEM_HANDLER'，index:index}），
editItem:（）=>dispatch（{type:'EDIT_ITEM'}），
itemIndexChanger:（index）=>dispatch（{type:'CHANGE\u ITEM\u index'，index:index}），
initialState:（值）=>dispatch（{type:'SET_STATE'，payload:value}）
};
}
导出默认连接（MapStateTrops、mapDispatchToProps）（列表）

据推测，在调用函数fetchdata后，它应该console.log我在mapStateProps中设置的状态，但是它给出了未定义的，即使该状态根本没有定义。。。 我的意图是将此fetchdata函数设置为axios put请求，但我无法执行此操作，因为我要发送的数据（即我在MapStateTops中设置的“项”）返回未定义，这意味着我无法访问MapStateTops中的内容

你们知道我做错了什么吗

---

感谢您的关注

看来fetchData函数不在组件列表中。因此，您无法访问组件的

此

，您将获得“无法读取未定义属性'props'”。

我认为我们需要此文件的其余部分

此

可以根据调用函数的位置进行更改。在类“body”中移动

获取数据

方法。请提供完整的代码。。有了list组件来回答您的问题，正如你们所看到的，这里有完整的代码，我可以在render方法内部访问mapStateToProps属性，但不能在它之外。。。