The process of instantiating API components to our extension.

To use an extensibility API component in your extension, you usually have to instantiate the class in the component first. To instantiate the class, pass the ID of the class to the getComponent() method on the container object. It is also good practice to check that the component exists before accessing its methods or properties. If the component instantiation fails, getComponent() returns null.

var pdp = container.getComponent('PDP');
if (pdp) {
  var stockinfo = pdp.getStockInfo();
}
else {
  console.log('Could not instantiate PDP.');
}

Some components in the extensibility API expose classes that do not need to be instantiated with getComponent(). Instead, classes in the following components are added as dependencies when defining modules such as models, views, and collections:

  • SCCollection
  • SCCollectionView
  • SCFormView
  • SCModel
  • SCView

Access the Frontend Components

To access the frontend components:

  1. Access a frontend component in the mountToApp() function in the entry point for your extension.By default, the entry point file is located in the JavaScript subdirectory in your extension code and uses the following naming convention:
<Vendor.ExtensionName.ModuleName>.js

2. Define the dependencies:

define(
  'Vendor.ExtensionName.1.0.0.Extension'
,  [
    'Vendor.ExtensionName.1.0.0.ExtensionName.Model'
  , 'Vendor.ExtensionName.1.0.0.Extension.View'
    ]
,  function (
     ExtensionModel
  ,  ExtensionView
  )

3. Instantiate the component with the getComponent() method on the container object. Since you can use the same entry point file for all three applications (MyAccount, Checkout, or Shopping), make sure that your component is not null before using it.

The following example shows how to call the PDP component and test to see that it exists before passing it to the rest of the models and views:

{
  'use strict';
  return {
    mountToApp: function mountToApp (container) {
      var pdp = container.getComponent('PDP');           
      if (pdp) {
        pdp.addChildViews()
        new ExtensionModel({pdp: pdp});
      }
    }
  }
});

Access the Backend Component

Access BackEndCartComponent anywhere in the SuiteScript code, using the Application.getComponent(component_name) method.

Currently, only the BackEndCartComponent component is available to SuiteScript code.

To access the backend component

  1. Define the dependencies:
define('Vendor.ExtensionName.1.0.0.Extension.File'
,   [
        'Application'
    ,   'underscore'
    ]
,   function(
       Application
    ,   _
    )

To access the backend component, you must include Application as a dependency.

2. Use the getComponent() method to access the BackEndCartComponent instance:

{
    'use strict';
     
    // Get the cart component
    var cart_component = Application.getComponent('Cart');
});

Leave a comment

Your email address will not be published. Required fields are marked *