如何在React Native中从表中呈现随机对象?

时间:2018-05-24 11:40:02

标签: javascript react-native

我想在React Native中从表中渲染随机对象。 我为我的表使用React Native EasyGrid。 我尝试在React Native中构建一个记忆游戏。 我需要这个代码用于随机播放卡。

这是我为测试所有功能而编写的代码。 他们希望我提供更多信息,但我没有更多信息。

代码:

import React from 'react'
import { StyleSheet, View, TextInput, Button, Text, TouchableOpacity, FlatList, ActivityIndicator,} from 'react-native'
import { Col, Row, Grid } from "react-native-easy-grid";


export default class App extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
		color: "red",
		card: "this.refs.card",
		cards: "[...card]"
		}
  }
 

 
 
_code to randomized (Like shuffle(array) in JS, but not this function !) {

// I need the code here

}


componentDidMount() {
	
		this.setState({cards: this._shuffle(this.state.cards)});

}



  _test = () => {

	this.setState({color: this.state.color === "red" ? "blue" : "red"});

	}
	
  render() {
    return (
      <View style={styles.container}>

	<Grid ref="deck">		
		<Col>
			<Row>
			
			<TouchableOpacity ref="card" onPress={this._test}>
				<Text style={{ height: 15 }}>1</Text>	
			</TouchableOpacity>
			
			</Row>
			<Row>
			
			<TouchableOpacity ref="card" onPress={this._test}>
				<Text style={{ height: 15 }}>2</Text>
			</TouchableOpacity>
			
			</Row>
			<Row>
			
			<TouchableOpacity ref="card" onPress={this._test}>
				<Text style={{ height: 15 }}>3</Text>
			</TouchableOpacity>
			
			</Row>
			<Row>
			
			<TouchableOpacity ref="card" onPress={this._test}>
				<Text style={{ height: 15 }}>4</Text>
			</TouchableOpacity>
						
			</Row>		
		</Col>	
	</Grid>	  
	  
	  <View><Text style={{color: this.state.color}}>XXX</Text></View>
	  
</View>      
	  	
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

有人可以帮帮我吗?

0 个答案:

没有答案