如何在Blockly自定义块的`onchange`事件中获取值?

时间:2015-05-03 19:30:14

标签: javascript blockly

我正在为Blockly制作一个自定义块,需要验证输入。在onchange事件中,我想警告用户是否输入了无效的输入值。

这是我的块:

enter image description here

Blockly.Blocks['motor'] = {
    init: function() {
        this.setHelpUrl('http://www.example.com/');
        this.setColour(65);
        this.appendDummyInput()
            .appendField("motor( ");
        this.appendValueInput("port_number")
            .setCheck("Number");
        this.appendDummyInput()
            .appendField(");");
        this.setInputsInline(true);
        this.setPreviousStatement(true);
        this.setNextStatement(true);
        this.setTooltip('');
    },
    onchange: function(ev) {
        if (this.getFieldValue('port_number') > '3') {
            this.setWarningText('Port must be 0 - 3.');
        } else {
            this.setWarningText(null);
        }
    }
};

Blockly Developers Page上,它有一个获取输入值的基本示例。但是,每次undefined触发时,我都会返回onchange

如何处理这些输入的验证?我不想为输入创建一个下拉列表,因为我需要能够从变量,int块等输入。

2 个答案:

答案 0 :(得分:2)

不确定这是否是处理此问题的最佳方法,但它对我有用。我只是使用valueToCode方法访问输入值。然后我可以验证输入值。

  

注意:onchange处理程序的上下文是块,因此传递   this作为Blockly.C.valueToCode的第一个参数将获得   来自正确块的值。

Blockly.Blocks['motor'] = {
    init: function() {
        this.setHelpUrl('http://www.example.com/');
        this.setColour(65);
        this.appendDummyInput()
            .appendField("motor( ");
        this.appendValueInput("port_number")
            .setCheck("Number");
        this.appendDummyInput()
            .appendField(");");
        this.setInputsInline(true);
        this.setPreviousStatement(true);
        this.setNextStatement(true);
        this.setTooltip('');
    },
    onchange: function(ev) {
        var port_number = Blockly.C.valueToCode(this, 'port_number', Blockly.C.ORDER_ATOMIC);
        var valid = VALIDATE.motor_port_number(port_number);
        if (!valid) 
            alert("WARNING: The value for the motor port must be 0, 1, 2 or 3.");
        }
    }
};

答案 1 :(得分:0)

试试这个:

this.getInputTargetBlock('port_number').toString()

或者:

this.getInputTargetBlock('port_number').getFieldValue(/*field_name*/)

示例:

   Blockly.Blocks['stop_actions'] = {
    init: function() {
        var actions_descriptors = [
            ['HOLD', 'hold'],
            ['COAST', 'coast']
        ];
        this.appendDummyInput()
            .appendField(new Blockly.FieldDropdown(actions_descriptors), 'action')
            .setAlign(Blockly.ALIGN_RIGHT);
        this.setOutput(true, 'String');
        this.setColour(60);
        this.setTooltip('Select the stop action');
    }
};

Blockly.Blocks['motor'] = {
    init: function() {
        this.appendValueInput('arg_stop_action')
            .appendField('Stop action')
            .setAlign(Blockly.ALIGN_RIGHT);
    },

    onchange: function(e) {
        this.getInputTargetBlock('arg_stop_action').getFieldValue('action')
    }
};