#Plugin

Trong NocoBase, Client Plugin là cách chính để mở rộng và tùy chỉnh các chức năng frontend. Bằng cách kế thừa lớp cơ sở Plugin được cung cấp bởi @nocobase/client, nhà phát triển có thể đăng ký logic, thêm các thành phần trang, mở rộng menu hoặc tích hợp các chức năng của bên thứ ba tại các giai đoạn vòng đời khác nhau.

#Cấu trúc lớp Plugin

Dưới đây là cấu trúc cơ bản của một plugin phía máy khách:

import { Plugin } from '@nocobase/client';

export class PluginHelloClient extends Plugin {
  async afterAdd() {
    // Thực thi sau khi plugin được thêm
    console.log('Plugin added');
  }

  async beforeLoad() {
    // Thực thi trước khi plugin tải
    console.log('Before plugin load');
  }

  async load() {
    // Thực thi khi plugin tải, đăng ký các route, thành phần UI, v.v.
    console.log('Plugin loaded');
  }
}

export default PluginHelloClient;

#Mô tả vòng đời

Mỗi plugin sẽ lần lượt trải qua các giai đoạn vòng đời sau khi trình duyệt được làm mới hoặc ứng dụng được khởi tạo:

#Thứ tự thực thi

Mỗi khi trình duyệt được làm mới, các phương thức afterAdd() → beforeLoad() → load() sẽ được thực thi.

#Ngữ cảnh Plugin và FlowEngine

Bắt đầu từ NocoBase 2.0, các API mở rộng phía máy khách chủ yếu tập trung trong FlowEngine. Trong lớp plugin, bạn có thể lấy thể hiện của engine thông qua this.engine.

// Truy cập ngữ cảnh engine trong phương thức load()
async load() {
  const { app, router, apiClient } = this.engine.context;
  console.log('Current app:', app);
}

Để biết thêm chi tiết, vui lòng xem:

• FlowEngine
• Ngữ cảnh