我想使用redux来存储下拉菜单中的值,并在以后将其用作我的应用程序的示例案例,但是它始终会引发Invariant Violation 这是我的App.js
export default class App extends Component{
render() {
const store = createStore(reducers, {},applyMiddleware(ReduxThunk));
return (
<Provider store={store}>
<Picker />
</Provider>
);
}
}
Picker.js
class Picker extends Component {
ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 });
constructor() {
super();
this.onChangeText = this.onChangeText.bind(this);
this.handleDestroyItem = this.handleDestroyItem.bind(this);
}
ds = new ListView.DataSource({ rowHasChanged: (r1, r2) => r1 !== r2 });
onChangeText(text) {
this.props.dispatch({ type: 'ADD_ITEM', text });
}
handleDestroyItem(id) {
this.props.dispatch({ type: 'REMOVE_ITEM', id });
}
renderRow = (rowData, sectionID, rowID) => {
return (
<View>
<Text>{rowData}</Text>
<TouchableOpacity
onPress={() => {
this.handleDestroyItem(rowID);
}}>
<Text>Delete</Text>
</TouchableOpacity>
</View>
);
};
render() {
let data = [{ value: 'Banana' }, { value: 'Mango' }];
return (
<View>
<Dropdown label="Add Commodity" data={data} onChangeText={this.onChangeText} />
<ListView dataSource={this.ds.cloneWithRows(this.props.dataSource)} renderRow={this.renderRow} enableEmptySections />
</View>
);
}
}
const dataSource = new ListView.DataSource({
rowHasChanged: (r1, r2) => r1 !== r2,
});
function mapStateToProps(state) {
return {
dataSource: dataSource.cloneWithRows(state),
};
}
reducer文件夹中有一个索引文件,其中包含一个reducer,并且与datareducer链接