道具中缺少 obj - alt

obj is missing in props - alt

我是新手。在我的 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
   };

如何在道具中获得obj?

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

在您的例子中,您已经在商店构造函数中定义了 this.state
所以在你的组件中,你应该访问 this.props.state.obj。在 React 中,这是一个相当令人困惑的名字。

最好的解决方案可能是更改构造函数中的代码:

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

至:

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

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