如何在此处呈现上下文API中包装的视图
import React, { Component } from 'react';
import { storeProducts, detailProduct } from "./data";
import { StyleSheet } from "react-native";
const AccountContext = React.createContext();
//Provider : provides data
//Consumer : access data
class AccountProvider extends Component {
state = {
IsLoggedIn: true,
Account: {},
products: [],
dettailProduct: detailProduct,
cart: [],
progressbar: false
};
componentDidMount() {
this.setProducts();
}
setProducts = () => {
let tempproducts = [];
storeProducts.forEach(item => {
const singleitem = { ...item }; //three dots indicate comping value not referencing
tempproducts.push(singleitem);
});
this.setState(() => {
return { products: tempproducts };
});
};
onLogin = async (username, password) => {
console.log("Hello from LogIn")
}
render() {
return (
// I am able to access value from my context API but my wrapped views are not rendering.
<AccountContext.Provider
Passing these functions
value={{
...this.state,
setProducts: this.setProducts,
onLogin: this.onLogin
}}
>
{this.props.children}
</AccountContext.Provider >
);
}
}
const AccountConsumer = AccountContext.Consumer;
export { AccountProvider, AccountConsumer };
import React, { Component } from 'react';
import { StyleSheet, Text, View, Button } from 'react-native';
import { createSwitchNavigator, createAppContainer } from 'react-navigation';
import { AccountConsumer } from "../../context"
class ReorderItems extends Component {
render() {
return (
<AccountConsumer>
{(value => {
// I am able to access value from my context API but my wrapped views are not rendering.
<View style={styles.container} >
<Text>ReOrderItems</Text>
<Text>ReOrderItems</Text>
<Text>ReOrderItems</Text>
<Text>ReOrderItems</Text>
<Text>ReOrderItems</Text>
</View>
// I am able to access value from my context API but my wrapped views are not rendering.
})}
</AccountConsumer>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
});
export default ReorderItems;
我能够从我的上下文API访问值,但是我的包装视图未呈现。