# Estado temporário
Você pode usar o estado temporário para armazenar e fazer referência a dados locais em um aplicativo. Cada vez que você carrega ou atualiza um aplicativo, o valor do estado temporário é redefinido.
## Cenários de casos de uso
Os estados temporários podem ajudar nos seguintes cenários:
* Para rastrear os valores temporários de uma variável quando o usuário interage com seu aplicativo.
* Para armazenar seus dados apenas em operação sem persistir em um banco de dados.
* Para funcionar como uma propriedade temporária quando propriedades integradas no PocketBlocks (como `{{tabela.selectedRow}}` e `{{seletor.value}}`) não suportam seu caso de uso.
Para armazenar e acessar dados em aplicativos no seu espaço de trabalho, use o localStorage.
## Crie um estado temporário
Clique em **+ Novo** e selecione **Estado temporário** no editor de consultas.
Você pode renomear o estado temporário e definir um valor inicial.
## Definindo valores de estado
O estado temporário oferece métodos `setValue()` e `setIn()` para definir ou alterar seu valor, que podem ser chamados em consultas JavaScript.
Use `setValue()` para alterar o valor diretamente.
```javascript
//state.setValue(value: any)
state.setValue(3);
state.setValue(input1.value);
```
Quando o valor inicial de um estado temporário é um objeto, use `setIn()` para alterar o valor em um caminho especificado.
```javascript
// valor inicial de estado2 da seguinte forma:
{
garota: {
nome: "Lucia",
idade: 18,
cidade: {
nome: "Nova Iorque"
}
}
garoto: {
nome: "Bob",
idade: 21,
cidade: {
nome: "Los Angeles"
}
}
}
//Para alterar o valor em um caminho especificado
//estado.setIn(caminho, qualquerValor)
//caminho: uma matriz de chaves ou índices. Somente o último item do caminho será alterado.
estado2.setIn(['garota','cidade'],{nome:'Seatle'})
estado2.setIn(['garoto','idade'],18)
// Para definir o valor da matriz de valor, você pode usar
// valor inicial = ["olá", "mundo"]
estado2.setIn([1],"fulano") // isso resultará em ["olá", "fulano"]
```
Você também pode chamar esses dois métodos em [manipuladores de eventos](/portugues-brasil/construcao-de-aplicativos/event-handlers.md). Selecione **Definir estado temporário** como ação e escolha o método sob demanda.
## Exemplo: Incremento de um contador
Neste exemplo, o contador rastreia o número de cliques no botão. Cada vez que o usuário clica no botão, o número no componente de texto aumenta em um.
Crie um contador de incremento nas seguintes etapas:
1. Adicione um componente de botão `botao1` e um componente de texto `texto1`.
2. Crie um estado temporário `estado1`, defina seu valor inicial como `0`. Vincule `{{estado1.value}}` como o texto de exibição de `texto1`.
3. Adicione um manipulador de eventos para `botao1`. Selecione a ação **Definir estado temporário** e o método **setValue**, e então defina `{{estado1.value+1}}` como o valor.
4. Clique no botão, você pode ver que o valor de `texto1` aumenta em um cada vez que você clica.
Você também pode obter o mesmo resultado usando consultas JavaScript:
1. Adicione uma nova consulta e selecione **Executar código JavaScript**.
2. Escreva a consulta JavaScript com este código e configure-a para ser invocada manualmente:\
`estado1.setValue(estado1.value + 1)`
3. Adicione um manipulador de eventos `botao1` para executar `consulta1`.
Agora clique no botão **Incrementar contador**, você deverá ver o mesmo resultado acima.
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://pocketblocks.pedroza.dev/portugues-brasil/construcao-de-aplicativos/write-javascript/temporary-state.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
