>new to react native cleary.努力隐藏视图。我正在尝试单击TouchableWithoutFeedback以更改视图的不透明度。我正在使用this.state来尝试这样做,但是无论我在状态上设置什么,它都无法在gotoNext函数中找到
export default class MainView extends Component
{
constructor(props) {
super(props);
this.state = {hideInfo:false,infoOpacity:0.75};
}
onTap(){
console.log("tap tap");
this.setState({hideInfo:!this.state.hideInfo});
if(this.state.hideInfo)
{
this.setState({infoOpacity:0});
}else{
this.setState({infoOpacity:0.75});
}
};
render()
{
var pages = []
for (var i = 65; 90 >= i; i++) {// A-65, Z-90
c = String.fromCharCode(i);
var letters = []
customData.pages.forEach(function(meow){
if(meow.letter.toUpperCase() == c)
{
letters.push(meow);
}
});
var ranPage = letters[Math.floor(Math.random() * letters.length)];
const window = Dimensions.get('window');
if(ranPage){
pages.push(
<View key={1}>
<TouchableWithoutFeedback onPress={this.onTap.bind(this)}>
<Image source={{uri: ranPage.image}} style={{width: window.width, height: window.height}} />
</TouchableWithoutFeedback>
<View style={[styles.meow, {opacity: this.state.infoOpacity}]}>
<Text style={styles.text}>{ranPage.name}</Text>
<Text style={styles.text}>{ranPage.phonetic}</Text>
<Text style={styles.text2}>{ranPage.description}</Text>
</View>
</View>
)
}else{
console.log(c)
}
}
return (
<Swiper style={styles.wrapper} showsButtons={true}>
{pages}
</Swiper>
);
}
}
this.state.x = y 不会重新渲染。你需要再次调用this.setState({x:y}(进行渲染