Assim, podemos chegar à tela do jogo agora e o computador está adivinhando
um número aqui, um número aleatório que exclui nosso número real para o primeiro palpite inicial.
Agora precisamos ter certeza de que suposições subsequentes podem ser feitas quando pressionamos o botão inferior ou superior
aqui na tela do jogo. Para isso, vamos
adicionar uma função dentro do nosso componente funcional, porque essa função precisará acessar o estado circundante
e o componente circundante e atribuir o nome que você desejar, como próximo manipulador de adivinhação, qualquer nome que você preferir e essa
é uma função que você
realmente deve ter um argumento, a direção em que o próximo palpite deve
ser, tão baixo ou maior. Agora, a
primeira coisa que quero fazer aqui é garantir que validemos a direção.
Agora, essa função aqui deve ser executada quando os botões lá embaixo são pressionados, mas é
claro o valor da direção, portanto o valor que passamos como argumento deve diferir com base
no botão.
Portanto, aqui temos o próximo manipulador de palpites conectado ao onPress, sem parênteses, para fornecer esse
ponteiro em nossa função ao onPress, para que seja executado eventualmente quando o usuário pressionar
isso, mas fui pré-configurar o argumento que será passado para o próximo manipulador de palpites quando isso
é executado.
Podemos fazer isso com o bind, vincular isso porque o primeiro argumento a vincular é sempre o que isso deve se
referir na função que está sendo chamada, não importa aqui, então podemos apenas vinculá-lo a isso.
O segundo valor que passamos aqui para vincular será o primeiro argumento recebido por nossa função e,
portanto, esta será a direção recebida aqui e, é claro, depende de você qual lógica você usa aqui, para
mim faz
sentido simplesmente usar um string onde aqui passamos mais baixo como string e, para o outro botão, passamos maior para que tenhamos esses
dois identificadores que são
essencialmente passados para o próximo manipulador de palpites. Portanto, a direção será menor ou
maior e agora
queremos validar se isso está correto.
Então, por exemplo, se você selecionou um número digamos 55 e o computador adivinhou 60, se você der a
um computador a dica dos números deve ser maior, isso está obviamente errado
porque o número deve ser menor, seu número era 55, acho tinha 60 anos,
está incorreto se você
disser ao computador que o número que deve adivinhar em seguida deve ser maior que 60,
certo?
Portanto, queremos validar
isso e, portanto, aqui podemos verificar se a direção
é igual a mais baixa. Portanto, se você pressionou o botão inferior e a estimativa atual é menor, sugere a escolha do usuário; portanto, o computador adivinhou
um número menor que nossa escolha, então menor é a dica errada, certo, porque o
número
precisa ser menor, precisa ser
maior porque o palpite já era muito baixo. Portanto, esse é um cenário possível em que estamos recebendo
uma dica errada, a alternativa e vou colocá-la entre parênteses para deixar bem claro
que essa é uma condição aqui.
Portanto, a alternativa a
isso, a segunda condição que quero verificar é que a direção aqui é realmente maior
e, ao mesmo tempo, o palpite atual já é maior que a
nossa escolha e também é uma
dica incorreta, exatamente na direção oposta.
Nos dois casos em que estamos dando uma dica incorreta, quero lançar um alerta e você aprendeu que pode fazer isso com a API
de alerta, a classe de alerta que você pode importar do React Native no final. Então aqui, em nossa verificação, usarei alerta de alerta para
lançar um alerta com um título de, digamos, não minta, é claro que você pode escolher qualquer nome que quiser,
estou escapando da citação única
que fui imprimir como um personagem aqui com uma barra invertida à esquerda, porque, caso
contrário, fecharia a string porque estou usando aspas simples para cercar minhas strings.
Então esse é o meu
título e, em seguida, o texto pode ser que você saiba que isso está errado, mas é claro que
você pode ter qualquer texto que quiser aqui, também pode ser menos moralista, se quiser. Agora, quero apresentar um botão aqui e o botão
diz que já foram explicados os objetos que você passa para a terceira matriz de argumentos cujo
alerta recebe e aí o texto pode se arrepender e o estilo pode ser cancelado e você não precisa fornecer um manipulador
onPress, se você não fornecer uma, a única coisa que acontecerá é que clicar no botão fechará o
alerta, o que é bom.
Então, aqui estamos dando ao usuário um toque nos dedos, por assim dizer, e assegurando que nenhuma dica
incorreta seja
dada e que eu queira
retornar aqui, então quero interromper a execução da função se tivermos um valor tão incorreto.
Se passarmos por esse
bloco if, se dermos uma dica correta, queremos gerar um novo número aleatório.
Então, aqui, quero verificar se a direção é mais baixa e
agora sabemos que
estava correto, para que o computador adivinhe um número menor que o número anterior, então sabemos que
um novo número aleatório deve ser gerado para uma suposição atual. o limite superior máximo.
Portanto, podemos chamar gerar aleatoriamente entre novamente e o número mínimo, provavelmente esse é um, mas e se o
usuário já adivinhou outro número em
que dissemos ao computador que ele era muito pequeno e que teríamos um problema aqui porque
o menor limite nem sempre é um, e se o usuário adivinhou
10 e dissemos que não, tem que ser maior?
Bem, então o usuário adivinha 50 e dizemos que deve ser menor que isso, é claro que
o computador
deve adivinhar novamente, mas não deve adivinhar abaixo de 10, porque já mencionamos que isso é muito pequeno anteriormente.
Portanto, nosso máximo e mínimo atuais devem se ajustar ao longo do tempo, conforme sugerimos se o número calculado pelo computador é
muito pequeno ou muito grande.
Portanto, podemos usar outro gancho fornecido pelo React e esse é o gancho useRef.
Agora você deve conhecer esse gancho como um gancho que permite criar um objeto que pode ser vinculado a entradas; portanto,
seus elementos de entrada em jsx têm acesso a eles em seu código e essa é uma maneira
de usá-lo, mas useRef também permite que você fazer outra coisa que é bem legal.
Ele permite que você defina um valor que sobrevive à re-renderização do componente; portanto, o que resta
é a reconstrução desse componente e é exatamente
isso que precisamos aqui, porque queremos fazer o login no mínimo e no máximo que possamos alterar,
mas que não serão regenerados apenas. porque o componente é renderizado novamente.
Portanto, aqui na parte superior deste componente, depois de inicializar o estado, podemos criar
uma nova constante, currentLow talvez onde useRef seja um e, em seguida, outra constante, currentHigh em que useRef seja 100, esses são
nossos limites iniciais que estamos usando aleatoriamente número e agora podemos atualizar essas
referências aqui.
Então, sabemos que a direção deve ser menor, o que
podemos fazer nesse caso, em vez de gerar instantaneamente um novo número, podemos definir currentHigh. current, porque as referências geradas pelo
React são objetos que possuem uma propriedade atual em que o valor real
é armazenado, portanto,
definimos atual igual ao palpite atual.
Então, o que estamos dizendo é que, se eu estou lhe dizendo, o computador que você adivinhou é muito
grande e você deve adivinhar um número menor, então eu sei que esse número que adivinhei é meu currentHigh, o número correto pode ' não
seja maior que esse,
então eu salvo o número que adivinhei como meu máximo atual.
E, novamente, essas constantes de referência aqui não são regeneradas quando esse componente é criado novamente. Em
vez disso, se elas foram inicializadas uma vez, um pouco como o estado atual, elas são armazenadas
desanexadas desse componente e o React reconhece que elas já foram inicializadas. e não os
regenerará, mas, em vez disso, inicialize currentHigh com o valor armazenado anteriormente.
Portanto, é um pouco como se você estivesse gerenciando isso em um estado, a diferença para o estado, em vez disso, se você
alterar o valor armazenado lá, o componente não será renderizado novamente, porque não queremos isso aqui.
Não quero renderizá-lo novamente apenas porque estou salvando uma nova alta, que não tem impacto na minha opinião,
no meu código jsx, apenas
na minha lógica, mas, por isso, não precisa renderizar novamente o componente, é por
isso que uso uma referência aqui em vez de um estado.
Então, isso está acontecendo se for mais baixo;
se dissermos ao computador que o palpite é muito pequeno e o número
real deve ser
maior, deve ser maior. Nesse caso, definimos a corrente baixa como a palpite atual, porque sabemos nós temos um limite
inferior.
E agora o objetivo é ou o truque é gerar um novo número aleatório que leve esses limites em
consideração, portanto, onde
usamos a corrente baixa com nossa ref e depois. corrente no mínimo e currentHigh. current no máximo e quero
excluir o palpite atual, para que não possamos adivinhar o mesmo número aqui novamente, para que, para
a próxima função, definitivamente obteremos um número diferente. Então isso é algo que eu armazeno em um número constante e
próximo, que é gerado
aqui quando o
próximo manipulador de palpites é executado, o que acontece quando tocamos em um desses botões.
E agora o próximo número é o próximo número
que queremos usar, então agora o que podemos fazer como podemos chamar definir palpite atual e adicionar o
próximo número, agora o componente será renderizado novamente e produzirá o próximo palpite. Então, vamos tentar, por enquanto não temos o
jogo terminado,
mas pelo menos podemos tentar adivinhar números aqui.
Então, digito 53 como meu número,
agora começamos e o computador adivinhou 85.
Se agora digo mais, recebemos esse aviso porque mentimos, tínhamos 53 como número, portanto, o palpite é alto
demais, deve ser menor.
Agora são 28, bem, isso é muito baixo, deve ser maior.
Então, se eu tocar mais baixo, recebo o aviso, se eu tocar mais, subimos agora 78
e agora, neste momento, 23, o palpite anterior será nosso limite inferior e agora, quando
eu tocar mais baixo, 78 o palpite atual será nosso limite superior, então
o próximo palpite certamente não será superior a 78 e nem inferior a 23, mas ainda é
muito baixo, é muito grande, quero dizer,
é muito baixo, então vamos
usar um
maior, um mais baixo e
esse seria o correto .
Por enquanto, não temos nada que verifique se o
computador adivinhou corretamente.
Então, essa é a próxima coisa que teremos que implementar aqui.