javascript - 反应原生井字游戏

Question

我是本地人的新手，所以我想做一个井字游戏，但遇到了一些麻烦。

游戏不检查移动中的胜利我必须再按任何按钮 1 次才能在我的屏幕上显示谁是获胜者的结果。所以这是我检查程序中使用的胜利和 Handerl 的功能

function game(){
    
    
    if(A1 == kriz && B1 == kriz && C1 == kriz){
      konecIgreW1();
    }else if(A2 == kriz && B2 == kriz && C2 == kriz){
      konecIgreW1();
    }else if(A3 == kriz && B3 == kriz && C3 == kriz){
      konecIgreW1();
    }else if(A1 == kriz && A2 == kriz && A3 == kriz){
      konecIgreW1();
    }else if(B1 == kriz && B2 == kriz && B3 == kriz){
      konecIgreW1();
    }else if(C1 == kriz && C2 == kriz && C3 == kriz){
      konecIgreW1();
    }else if(A1 == kriz && B2 == kriz && C3 == kriz){
      konecIgreW1();
    }else if(C1 == kriz && B2 == kriz && A3 == kriz){
      konecIgreW1();
    }else if(A1 == krog && B1 == krog && C1 == krog){
      konecIgreW2();
    }else if(A2 == krog && B2 == krog && C2 == krog){
      konecIgreW2();
    }else if(A3 == krog && B3 == krog && C3 == krog){
      konecIgreW2();
    }else if(A1 == krog && A2 == krog && A3 == krog){
      konecIgreW2();
    }else if(B1 == krog && B2 == krog && B3 == krog){
      konecIgreW2();
    }else if(C1 == krog && C2 == krog && C3 == krog){
      konecIgreW2();
    }else if(A1 == krog && B2 == krog && C3 == krog){
      konecIgreW2();
    }else if(C1 == krog && B2 == krog && A3 == krog){
      konecIgreW2();
    }
    i++;
    if(i == 9){
      Alert.alert('Draw', 'Unfortunantly its a Draw',[
        {
          text: 'Finish', 
          onPress: () => navigation.goBack()
        },
        {
          text: 'One more', 
          onPress: oneMore3()
        },
      ], { 
        cancelable: true, 
       onDismiss: () => console.warm('New Game has started')
      }
      )
    }
  }



 const setA1Handller = () => {
    
    if(A1 == ''){
      if(navrsti == 'kriz'){
        setA1(kriz);
        navrsti = 'krog';
        
      }else{
        setA1(krog);
        navrsti = 'kriz';
        
      }
      
    }
    game();
  }
  const setA2Handller = () => {
    
    if(A2 == ''){
      if(navrsti == 'kriz'){
        setA2(kriz);
        navrsti = 'krog';
        
      }else{
        setA2(krog);
        navrsti = 'kriz';
        
      }
      
    }
    game();
  }
  const setA3Handller = () => {
    
    if(A3 == ''){
      if(navrsti == 'kriz'){
        setA3(kriz);
        navrsti = 'krog';
        
      }else{
        setA3(krog);
        navrsti = 'kriz';
        
      }
      
  }
  game();
}
  const setB1Handller = () => {
    
    if(B1 == ''){
      if(navrsti == 'kriz'){
        setB1(kriz);
        navrsti = 'krog';
        
      }else{
        setB1(krog);
        navrsti = 'kriz';
        
      }
      game();
  }
  
}
  const setB2Handller = () => {
    
    if(B2 == ''){
      if(navrsti == 'kriz'){
        setB2(kriz);
        navrsti = 'krog';
        
      }else{
        setB2(krog);
        navrsti = 'kriz';
        
      }
      game();
  }
  
}
  const setB3Handller = () => {
    
    if(B3 == ''){
      if(navrsti == 'kriz'){
        setB3(kriz);
        navrsti = 'krog';
        
      }else{
        setB3(krog);
        navrsti = 'kriz';
        
      }
      game();
  }
  
}
  const setC1Handller = () => {
    
    if(C1 == ''){
      if(navrsti == 'kriz'){
        setC1(kriz);
        navrsti = 'krog';
        
      }else{
        setC1(krog);
        navrsti = 'kriz';
        
      }
      game();
  }
  
}
  const setC2Handller = () => {
    
    if(C2 == ''){
      if(navrsti == 'kriz'){
        setC2(kriz);
        navrsti = 'krog';
        
      }else{
        setC2(krog);
        navrsti = 'kriz';
        
      }
      game();
  }
  
  }
  const setC3Handller = () => {
    
    if(C3 == ''){
      if(navrsti == 'kriz'){
        setC3(kriz);
        navrsti = 'krog';
        
      }else{
        setC3(krog);
        navrsti = 'kriz';
        
      }
      game();
  }
  


return(
    <View style={styles.body}>
        
          <Text style={styles.text}>
           Player 1: {Player1} {"\n"}
           Player 2: {Player2} 
          </Text>
          <Text style={styles.text}>
            {Player1score}: {Player2score}
          </Text>
          
          
        
      <Pressable
      onPress={onPressHandler}
        style={({pressed}) => ({ backgroundColor: pressed ? '#ddd' : '#0f0'})}
      >
      <Text style={styles.text}>
        Go Back 
      </Text>
      </Pressable>
      
      <View style={styles.container}>
        <View style={styles.mcontainer}>
          <TouchableOpacity style={styles.box} onPress={setA1Handller}>
            <Text style={styles.kk}>
            {A1}
            </Text>
          </TouchableOpacity>
          <TouchableOpacity style={styles.box} onPress={setB1Handller}>
            <Text style={styles.kk}>
             {B1} 
            </Text>
          </TouchableOpacity>
          <TouchableOpacity style={styles.box} onPress={setC1Handller}>
            <Text style={styles.kk}>
              {C1}
            </Text>
          </TouchableOpacity>
          </View>
          <View style={styles.mcontainer}>
          <TouchableOpacity style={styles.box} onPress={setA2Handller}>
            <Text style={styles.kk}>
              {A2}
            </Text>
          </TouchableOpacity>
          <TouchableOpacity style={styles.box} onPress={setB2Handller}>
            <Text style={styles.kk}>
              {B2}
            </Text>
          </TouchableOpacity>
          <TouchableOpacity style={styles.box} onPress={setC2Handller}> 
            <Text style={styles.kk}>
              {C2}
            </Text>
          </TouchableOpacity>
          </View>
          <View style={styles.mcontainer}>
          <TouchableOpacity style={styles.box} onPress={setA3Handller}>
            <Text style={styles.kk}>
              {A3}
            </Text>
          </TouchableOpacity>
          <TouchableOpacity style={styles.box} onPress={setB3Handller}>
            <Text style={styles.kk}>
              {B3}
            </Text>
          </TouchableOpacity>
          <TouchableOpacity style={styles.box} onPress={setC3Handller}>
            <Text style={styles.kk}>
              {C3}
            </Text>
          </TouchableOpacity>
          
        </View>
        
        
      </View>

    </View>
  )

标签： javascriptandroidreact-native