第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號(hào)安全,請(qǐng)及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問(wèn)題,去搜搜看,總會(huì)有你想問(wèn)的

無(wú)法將組件連接到 Redux 存儲(chǔ)

無(wú)法將組件連接到 Redux 存儲(chǔ)

慕勒3428872 2022-10-27 15:44:21
我正在嘗試將我的組件 CMSForm 連接到 Redux 商店,但無(wú)法這樣做。這是我的:減速器:const cmsDefaultState = {  cmsNum: "",  facilityName: ""};export default (state = cmsDefaultState, action) => {  switch (action.type){    case 'SET_CMS_ID':      return Object.assign({}, state, {        cmsNum: action.cmsNum      });    case 'SET_FACILITY_NAME':      return [             ...state,              action.facilityName          ];    default:      return state;  }};店鋪:import { createStore} from 'redux'import CMSReducer from './CMSReducer.js'export default () => {  const store = createStore(CMSReducer);  return store;};選擇器:export const getCMSNum = store =>  store.cmsNumexport const getFacilityName = store =>  store.facilityName方法:export const setCMSId = (cmsNum = '') => ({  type: 'SET_CMS_ID',  cmsNum});export const setFacilityName = (facilityName = '') => ({  type: 'SET_FACILITY_NAME',  facilityName});這是組件:import React from 'react'import { connect } from 'react-redux';import { setCMSId } from '../redux/methods'import { getCMSNum } from "../redux/selectors";function mapStateToProps(state) {  const { CMSReducer } = state  return { CMSForm: CMSReducer }}class CMSForm extends React.Component {  constructor(props) {    super(props);    this.state = {      cmsCertificationNumber: '',      facility_name: ''    };    this.handleChange = this.handleChange.bind(this);    this.handleCmsNumber = this.handleCmsNumber.bind(this);  }  handleCmsNumber = () => {    // dispatches actions to add todo    debugger    setCMSId(this.state.cmsCertificationNumber);    alert("CMS Number: " + this.state.cmsNum);  } // end of HandleCMSNumebr  handleChange(event) {   this.setState({cmsCertificationNumber: event.target.value}); }  render() {    return (      <div>        <input type="text" value={this.state.cmsCertificationNumber} onChange={this.handleChange} />        <button className="update-cmsNum" onClick={this.handleCmsNumber}>          Find        </button>      </div>    )  }
查看完整描述

1 回答

?
蕪湖不蕪

TA貢獻(xiàn)1796條經(jīng)驗(yàn) 獲得超7個(gè)贊


你需要糾正的事情:


在這里,您返回一個(gè)數(shù)組,但您的狀態(tài)是一個(gè)對(duì)象。


case 'SET_FACILITY_NAME':

   return [

          ...state,

           action.facilityName

       ];

如果你看一下這行代碼:


setCMSId(this.state.cmsCertificationNumber)


您只是在調(diào)用返回對(duì)象的函數(shù)。您應(yīng)該調(diào)度該操作。


您有一個(gè)未使用的功能


function mapStateToProps(state) {

 const { CMSReducer } = state

 return { CMSForm: CMSReducer }

}

您沒(méi)有使用此處映射到道具的狀態(tài):


export default connect(state => ({ cmsNum: getCMSNum(state) }))(CMSForm);

更新


您可以通過(guò)這種方式使用調(diào)度:


import React from 'react'

import { connect } from 'react-redux';

import { setCMSId } from '../redux/methods'

import { getCMSNum } from "../redux/selectors";



class CMSForm extends React.Component {


    constructor(props) {

        super(props);


        this.state = {

            cmsCertificationNumber: '',

            facility_name: ''

        };

    }


    handleCmsNumber = () => {

        // to dispatch the `setCMSId` action.

        this.props.setCMSId(this.state.cmsCertificationNumber);


    } // end of HandleCMSNumebr


    handleChange = (event) => {

        this.setState({ cmsCertificationNumber: event.target.value });

    }


    render() {

        console.log(this.props.cmsNum);

        return (

            <div>


                <input type="text" value={this.state.cmsCertificationNumber} onChange={this.handleChange} />


                <button className="update-cmsNum" onClick={this.handleCmsNumber}>

                    Find

        </button>

            </div>

        )

    }

} // end of component


const mapStateToProps = state => ({ cmsNum: getCMSNum(state) });

const mapDispatchToProps = {setCMSId};


export default connect(mapStateToProps, mapDispatchToProps)(CMSForm);


查看完整回答
反對(duì) 回復(fù) 2022-10-27
  • 1 回答
  • 0 關(guān)注
  • 165 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)