道具中缺少 obj - alt答案

【问题标题】：obj is missing in props - alt道具中缺少 obj - alt
【发布时间】：2015-11-02 06:28:43
【问题描述】：

我是新来的反应。在我的react+flux+alt+ES6 应用程序中，我有三个用于搜索操作的属性。当我尝试设置默认值时出现错误。

行动：

 import alt from 'altInstance';
 import AttributeSectionWebAPIUtils from 'utils/AttributeSectionWebAPIUtils';

    class SearchActions {
      searchAttribute(data) {
         this.dispatch(data);
         AttributeSectionWebAPIUtils.search(data)
           .done(function success() {
              // We might not need to do anything it successfully added due to optimistic updates.
        })
        .fail(function failure() {
          // dispatch an event if fails to notify user that it has failed
        });
      }
    }

    export default alt.createActions(SearchActions);

商店：

import SearchActions from 'actions/attributeSection/SearchActions';
import alt from 'altInstance';
   class AttributeSectionStore {
    constructor() {
    this.state = {
      obj: {
        attributeSectionId: '',
        name: '',
        description: ''
      }
    };
    this.bindListeners({
      handleSearch: SearchActions.SEARCHATTRIBUTE
    });
  }

  handleSearch(data) {
      this.emitChange(data);
      // otherwise, it is unchanged.
    }

}

导出默认 alt.createStore(AttributeSectionStore, 'AttributeSectionStore');

查看：

import React from 'react';
import { Input } from 'react-bootstrap';
import { ButtonToolbar } from 'react-bootstrap';
import { Button } from 'react-bootstrap';
import SearchActions from 'actions/attributeSection/SearchActions';
import AttributeSectionStore from 'stores/attributeSection/SearchStore';
// import styles from 'scss/_common';
/*
 * Code modified from https://github.com/facebook/flux/blob/master/examples/flux-todomvc/js/components/TopicTextInput.react.js
 */
export default class AttributeSectionSearch extends React.Component {
  static getPropsFromStores() {
    return AttributeSectionStore.getState();
  }

  searchAttribute = () => {
    SearchActions.searchAttribute();
  }
  render() {
    return (
      <div className="container">
        <div className="row">
          <h1>Attribute Sections</h1>
          <h3>Search Attribute Section</h3>
        </div>
        <div className="col-md-12">
          <div className="pull-right" >
            <Button bsStyle="primary">New</Button>
          </div>
        </div>
        <form className="form-horizontal">
         <div className="row">
          <div className="col-md-6">
            <Input type="text" label="Attribute Section ID" labelClassName="col-xs-3" wrapperClassName="col-xs-6" value={this.props.obj.attributeSectionId}/>
            <Input type="textarea" label="Description" labelClassName="col-xs-3" wrapperClassName="col-xs-6" value={this.props.obj.description}/>
          </div>
          <div className="col-md-6 form-group">
            <Input type="text" label="Name" labelClassName="col-xs-2" wrapperClassName="col-xs-6" value={this.props.obj.name}/>
          </div>
          </div>
          <div className="col-xs-2 col-xs-offset-10">
            <ButtonToolbar>
              <Button bsStyle="primary" onClick={this.searchAttribute}>Search</Button>
              <Button type="reset">Reset</Button>
            </ButtonToolbar>
          </div>
        </form>
      </div>
    );
  }
}

   AttributeSectionSearch.propTypes = {
      attributeSectionId: React.PropTypes.string,
      name: React.PropTypes.string,
      description: React.PropTypes.string
   };

如何在 props 中获取 obj？

【问题讨论】：

你遇到了什么错误？以及如何尝试设置 obj 道具？
**Error**: obj is missing in props 我在 store 中创建了 obj 状态对象
好的。创建组件时，您应该传递 obj 道具。类似的东西：
好的。创建组件时，您应该传递 obj 道具。类似于：

标签： reactjs reactjs-flux react-alt

【解决方案1】：

在 alt 中，getState() 获取您在“this”下定义的所有对象。在你的构造函数中。

就您而言，您已在商店构造函数中定义了 this.state。
所以在你的组件中，你应该访问this.props.state.obj。在反应中，这是一个非常令人困惑的名字。

最好的解决方案可能是在你的构造函数中改变你的代码：

this.state = {
  obj: {
    attributeSectionId: '',
    name: '',
    description: ''
  }

到：

this.obj = {
    attributeSectionId: '',
    name: '',
    description: ''
  }

那么你应该可以访问this.props.obj

【讨论】：