Nâng cấp trường tuỳ chỉnh

Vào tháng 7 năm 2019 (bản phát hành 2.20190722) một API các trường được mã hoá nhiều hơn đã được thêm. Mục đích tương thích ngược nhất có thể. Điều này có nghĩa là nếu bạn đã tạo một trước tháng 7 năm 2019, thì trường này rất có thể sẽ tiếp tục hoạt động. Trước khi quyết định xem trường tùy chỉnh của bạn có cần được nâng cấp hay không, bạn nên đọc thông qua phần Khu vực nguy hiểm và kiểm tra kỹ trường của bạn.

Do chưa có tiêu chuẩn hoá giữa các trường trước tháng 7 năm 2019 việc thực hiện tất cả các thay đổi mà nhà phát triển có thể cần thực hiện là rất khó. Tài liệu này cố gắng trình bày mọi thay đổi có thể xảy ra, nhưng nếu tài liệu này không về chủ đề nào đó mà bạn quan tâm, vui lòng đọc phần trên nhận hỗ trợ nâng cấp.

Khu vực nguy hiểm

Khu vực nguy hiểm là những nơi đã biết mà API thay đổi và trường của bạn có thể bị hỏng.

Blockly.Field.register

Bạn không thể đăng ký các trường đến hết ngày Blockly.Field.register();. Có giờ đây là không gian tênfieldRegistry xử lý việc đăng ký.

Blockly.Field.register('my_field_name', myFieldClass);

Trở thành:

Blockly.fieldRegistry.register('my_field_name', myFieldClass);

setText

Hàm setText không còn được gọi bởi lõi Blockly, vì vậy nếu setText của bạn hàm này chứa logic cần được chuyển sang xử lý giá trị bộ hàm, getTexthàm hiển thị (tuỳ thuộc vào chức năng chính xác của hàm setText đang làm gì).

CustomFields.UpgradeField.prototype.setText = function(newText) {
  // Do validation.
  if (typeof newText != 'string' || newText === this.text_) {
    return;
  }

  // Fire event.
  if (this.sourceBlock_ && Blockly.Events.isEnabled()) {
    Blockly.events.fire(new Blockly.Events.BlockChange(
        this.sourceBlock_, 'field', this.name, this.text_, newText
    ));
  }

  // Update text value.
  this.text_ = 'prefix' + newText;

  // Rerender.
  this.size_.width = 0;
};

Trở thành:

CustomFields.UpgradeField.prototype.doClassValidation_ = function(newValue) {
  if (typeof newValue != 'string') {
    return null;
  }
  return newValue;
};

CustomFields.UpgradeField.prototype.getText = function() {
  return  'prefix' + this.value_;
}

Blockly tự động xử lý:

  • Kiểm tra xem giá trị mới có khác với giá trị cũ hay không.
  • Đang cập nhật giá trị.
  • Kích hoạt sự kiện thay đổi.
  • Đang kết xuất lại trường này.

Bạn sẽ cần phải xử lý:

Bản nâng cấp được đề xuất là những nơi mà API trường đã được thay đổi, nhưng nếu bạn chọn không thực hiện thay đổi thì trường của bạn rất có thể vẫn hoạt động.

CÓ THỂ nối tiếp

Để biết thêm thông tin về các thuộc tính EDITABLESERIALIZABLE, hãy xem Thuộc tính có thể chỉnh sửa và chuyển đổi tuần tự.

CustomFields.UpgradeField.prototype.SERIALIZABLE = true;

Bạn có thể bỏ qua cảnh báo bên dưới, nhưng có thể giải quyết bằng cách xác định SERIALIZABLE thuộc tính:

Detected an editable field that was not serializable. Please define
SERIALIZABLE property as true on all editable custom fields. Proceeding
with serialization.

Cảnh báo ở trên có nghĩa là Blockly cho rằng bạn muốn được chuyển đổi tuần tự (vì thuộc tính EDITABLE là true), nhưng không thể chắc chắn cho đến khi bạn xác định thuộc tính SERIALIZABLE. Nếu bạn chọn để nguyên, mọi thứ sẽ hoạt động bình thường và trường của bạn sẽ đã chuyển đổi tuần tự nhưng bạn sẽ nhận được cảnh báo trên bảng điều khiển.

size_.width

this.size_.width = 0;

Trở thành:

this.isDirty_ = true;

Cảnh báo bên dưới có thể bỏ qua, nhưng bạn có thể giải quyết bằng cách đặt isDirty_ thay vì thuộc tính size_.width:

Deprecated use of setting size_.width to 0 to rerender a field. Set
field.isDirty_ to true instead.

Cảnh báo ở trên có nghĩa là Blockly đã phát hiện thấy bạn đang sử dụng một phương thức cũ để kết xuất lại và bạn muốn sử dụng phương pháp mới.

Để biết thêm thông tin về thuộc tính isDirty_, hãy xem isDirty_.

khởi tạo

Hàm init đã được tạo thành một mẫu hàm thành giảm mã trùng lặp trong lớp con.

CustomFields.UpgradeField.prototype.init = function() {
  if (this.fieldGroup_) {
    // Already initialized once.
    return;
  }

  // Call superclass.
  CustomFields.UpgradeField.superClass_.init.call(this);

  // Create DOM elements.
  this.extraDom_ = Blockly.utils.dom.createSvgElement('image',
      {
        'height': '10px',
        'width': '10px'
      });
  this.extraDom_.setAttributeNS('http://www.w3.org/1999/xlink',
      'xlink:href', 'image.svg');
  this.extraDom_.style.cursor = 'pointer';
  this.fieldGroup_.appendChild(this.extraDom_);

  // Bind events.
  this.mouseOverWrapper_ =
    Blockly.browserEvents.bind(
        this.getClickTarget_(), 'mouseover', this, this.onMouseOver_);
  this.mouseOutWrapper_ =
    Blockly.browserEvents.bind(
        this.getClickTarget_(), 'mouseout', this, this.onMouseOut_);

  // Render.
  this.setValue(this.getValue());
};

Trở thành:

CustomFields.UpgradeField.prototype.initView = function() {
  CustomFields.UpgradeField.superClass_.initView.call(this);

  this.extraDom_ = Blockly.utils.dom.createSvgElement('image',
      {
        'height': '10px',
        'width': '10px'
      });
  this.extraDom_.setAttributeNS('http://www.w3.org/1999/xlink',
      'xlink:href', 'image.svg');
  this.extraDom_.style.cursor = 'pointer';
  this.fieldGroup_.appendChild(this.extraDom_);
};

CustomFields.UpgradeField.prototype.bindEvents_ = function() {
  CustomFields.UpgradeField.superClass_.bindEvents_.call(this);

  this.mouseOverWrapper_ =
    Blockly.bindEvent_(
        this.getClickTarget_(), 'mouseover', this, this.onMouseOver_);
  this.mouseOutWrapper_ =
    Blockly.bindEvent_(
        this.getClickTarget_(), 'mouseout', this, this.onMouseOut_);
};

Điều này có nghĩa là tính năng chặn giờ đây sẽ tự động xử lý:

  • Kiểm tra xem trường này đã được khởi tạo hay chưa.
  • Đang tạo fieldGroup_.
  • Kết xuất trường.
  • Liên kết chú thích và hiển thị sự kiện của trình chỉnh sửa.

Bạn sẽ cần phải xử lý:

onMouseDown_

CustomFields.UpgradeField.prototype.onMouseDown_ = function(e) {
  // ...
};

Trở thành:

CustomFields.UpgradeField.prototype.showEditor_ = function() {
  // ...
}

Bạn nên ghi đè hàm showEditor_ để xử lý chuột thay vì hàm onMouseDown_ vì hàm này cho phép dữ liệu đầu vào truyền thông qua hệ thống cử chỉ.

Để biết thêm thông tin về người chỉnh sửa, hãy xem mục Người chỉnh sửa.

setValue

Hàm setValue hiện là một mẫu hàm thành giảm mã trùng lặp trong lớp con. Nếu hàm setValue của bạn chứa logic, hãy cân nhắc việc tái cấu trúc mã để phù hợp với đường dẫn xử lý giá trị được mô tả trong Xử lý giá trị.

text_

Bạn không bao giờ nên truy cập hoặc cập nhật thuộc tính text_ của trực tiếp. Thay vào đó, hãy sử dụng Hàm getText để truy cập vào văn bản dễ đọc của trường của bạn và Hàm setValue để cập nhật giá trị được lưu trữ của trường.

Để biết thêm thông tin về giá trị của một trường so với văn bản của trường đó, hãy xem Cấu tạo của một trường.

Đang được hỗ trợ nâng cấp

Nội dung cần cung cấp

Khi yêu cầu hỗ trợ, tốt nhất bạn nên đặt những câu hỏi cụ thể:

Không nên dùng: "Trường này có vấn đề gì?"

Cũng không nên: "Giúp tôi nâng cấp trường này".

Đề xuất: "Văn bản của trường không cập nhật đúng cách."

Bạn cũng cần cung cấp các nguồn lực cho những người hỗ trợ bạn. Các tệp phải dễ sử dụng.

Không nên dùng:

  • Hình ảnh mã.
  • Mã chưa hoàn chỉnh.

Được đề xuất:

  • Điền mã trường ở định dạng văn bản.
  • Ảnh GIF cho thấy hành vi xấu trong trường.
  • Các bước tái tạo hành vi không hợp lệ của trường.
  • Phiên bản blockly mà bạn đang nâng cấp.

Nơi đăng

Câu hỏi về việc nâng cấp các nhà phát triển bị chặn diễn đàn chính.

Nếu chắc chắn rằng vấn đề là vấn đề với lõi khối, bạn có thể cũng đăng vấn đề trên GitHub. Nếu bạn quyết định đăng một vấn đề, vui lòng điền vào tất cả thông tin bắt buộc.