Beagle v1.5 não é mais mantida ativamente. A versão documentada que você está visualizando pode conter funcionalidades depreciadas. Para obter as funcionalidades mais recentes, consulte a nossa última versão .
OsimpleForm
é responsável por renderizar um formulário em tela.
A sua estrutura é representada como mostrado abaixo:
Atributo | Tipo | Obrigatório | Definição |
---|---|---|---|
onSubmit | List <Action> | ✓ | Array de ações que esse botão pode disparar quando um formulário é enviado |
children | List<ServerDrivenComponent> | ✓ | Define a lista de componentes visuais que compoe o formulário (server-driven) |
context | ContextData | Adiciona um contexto para o simple form |
Ao criar um formulário é importante entender dois passos respectivamente
O componente TextInput é o campo em que o usuario ou o sistema preencherá com alguma informação, e é importante conhecer seus atributos para melhor utiliza-lo. Aqui utilizaremos um de seus elementos , que é a função onChange
.
Essa função é parte do componente Text Input e observa as modificações feitas dentro do seu campo, ou seja, sempre que o valor for modificado, algo for digitado, apagado, etc, essa função é chamada e ativa uma lista de outras ações para acontecer sempre que o valor mudar. É nessa lista que adicionamos uma ação SetContext para definir o valor do Contexto do formulário e atualizar os valores que são mostrados no campo.
Veja abaixo como implementamos o nosso SimpleForm
SimpleForm(
context = ContextData(id = "myContext", value = ""),
children = listOf(
TextInput(
value = "@{myContext}",
placeholder = "Type in your password",
onChange = listOf(
SetContext(contextId = "myContext", value = "@{onChange.value}")
)
),
Button(text = "Click to Submit", onPress = listOf(SubmitForm()))
),
onSubmit = listOf(
Alert(
title = "Data submited",
message = "The password is " + "@{myContext}"
)
)
)
É uma função do SimpleForm que executa uma lista de ações. Ele é cho quando o formuário for submetido
Para submeter um formulário é preciso utilizar a ação SubmitForm e para chama-la basta somente implementa-la em um Botão que seja parte do SimpleForm, ou seja, que esteja em sua lista de filhos.
Ao clicar nesse botão, o onSubmit é ativados e a lista de ações será executada. É essa lista de ações que definirá o que deve acontecer com as informações so formulario, se serão enviadas para um backend (através da ação sendRequest), etc
Was this page helpful?
Glad to hear it! Please tell us how we can improve.
Sorry to hear that. Please tell us how we can improve.