道具中缺少 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
我是新手。在我的 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