Un validador es una función que toma el nuevo valor de los campos y, luego, actúa sobre él. Son una forma sencilla de personalizar un campo. Te permiten activar la funcionalidad cuando cambia el valor de un campo, modificar la entrada o limitar los valores que son aceptables.
A continuación, hay algunos ejemplos comunes:
- Restringir un campo de texto para que solo acepte letras
- Se requiere que un campo de texto no esté vacío.
- Se requiere que una fecha sea futura.
- Modificar la forma de un bloque según un menú desplegable
Tipos de validadores
Los validadores se ejecutan en diferentes momentos según el tipo de validador que sean.
Los validadores de clase forman parte de la definición de clase de un tipo de campo y, por lo general, se usan para restringir el tipo de valor que permite el campo (p.ej., los campos numéricos solo aceptan caracteres numéricos). Los validadores de clase se ejecutan en todos los valores que se pasan al campo (incluido el valor que se pasa al constructor).
Para obtener más información sobre los validadores de clase, consulta la sección Implementa un validador de clase en Cómo crear un campo personalizado.
Los validadores locales se definen en el momento de la construcción de un campo. Los validadores locales se ejecutan en todos los valores que se pasan al campo excepto el valor que se pasa al constructor. Esto significa que se ejecutan en los siguientes sistemas operativos:
- Son los valores que se incluyen en el XML.
- Valores que se pasan a
setValue
. - Valores que se pasan a
setFieldValue
. - Son los valores que cambió el usuario.
Los validadores de clase se ejecutan antes que los validadores locales porque actúan como guardianes. Se aseguran de que el valor sea del tipo correcto antes de pasarlo.
Para obtener más información sobre la secuencia de validación de valores y los valores en general, consulta Valores.
Cómo registrar un validador local
Los validadores locales se pueden registrar de dos maneras:
- Se agrega directamente en el constructor de un campo.
Blockly.Blocks['validator_example'] = {
init: function() {
// Remove all 'a' characters from the text input's value.
var validator = function(newValue) {
return newValue.replace(/\a/g, '');
};
this.appendDummyInput()
.appendField(new Blockly.FieldTextInput('default', validator));
}
};
- Con
setValidator
.
Blockly.Blocks['validator_example'] = {
init: function() {
// Remove all 'a' characters from the text input's value.
var validator = function(newValue) {
return newValue.replace(/\a/g, '');
};
var field = new Blockly.FieldTextInput('default');
field.setValidator(validator);
this.appendDummyInput().appendField(field);
}
};
Cualquiera de los métodos anteriores se puede incluir en una extensión para admitir el formato JSON.
El valor del campo puede ser muy diferente según el tipo de campo que se valida (p.ej., un campo numérico almacenará un número, mientras que un campo de entrada de texto almacenará una cadena), por lo que es mejor leer la documentación del campo específico antes de crear un validador.
Valores de retorno
El valor de devolución del validador determina qué hará el campo a continuación. Existen tres posibilidades:
Valor de devolución modificado
Un valor modificado o diferente, que luego se convierte en el nuevo valor del campo. A menudo, se usa para limpiar un valor, por ejemplo, quitando los espacios en blanco finales.
Ejemplo de un validador de modificación:
// Remove all 'a' characters from the text input's value.
var validator = function(newValue) {
return newValue.replace(/\a/g, '');
};
Valor de devolución nulo
Es nulo, lo que significa que el valor proporcionado no es válido. En la mayoría de los casos, el campo ignorará el valor de entrada. El comportamiento exacto se especifica en la función doValueInvalid_
del campo.
Ejemplo de un validador de nulos:
// Any value containing a 'b' character is invalid. Other values are valid.
var validator = function(newValue) {
if (newValue.indexOf('b') != -1) {
return null;
}
return newValue;
};
Valor de devolución no definido
Indefinido (o sin instrucción de devolución) o el valor de entrada, lo que significa que el valor de entrada debe convertirse en el nuevo valor del campo. Estos tipos de validadores suelen actuar como objetos de escucha de cambios.
Ejemplo de un Listener Validator:
// Log the new value to console.
var validator = function(newValue) {
console.log(newValue);
};
Ten en cuenta una vez más que el texto de visualización no necesariamente refleja el valor del campo.
Valor de este
Dentro de un validador, this
hace referencia al campo, no al bloque. Si necesitas acceder al bloque dentro de un validador, usa la función getSourceBlock
. También puedes usar la función bind
para establecer el contexto en el que se llama al validador.
Código de muestra con getSourceBlock
:
Blockly.Blocks['colour_match'] = {
init: function() {
this.appendDummyInput()
.appendField(new Blockly.FieldColour(
null, this.validate
), 'COLOUR');
this.setColour(this.getFieldValue('COLOUR'));
},
validate: function(colourHex) {
this.getSourceBlock().setColour(colourHex);
}
};
Código de muestra con bind
:
Blockly.Blocks['colour_match'] = {
init: function() {
this.appendDummyInput()
.appendField(new Blockly.FieldColour(
null, this.validate.bind(this)
), 'COLOUR');
this.validate(this.getFieldValue('COLOUR'));
},
validate: function(colourHex) {
this.setColour(colourHex);
}
};