```mountToApp: function mountToApp (container) {...
# suitecommerce
l
Copy code
mountToApp: function mountToApp (container)
		{
			// using the 'Layout' component we add a new child view inside the 'Header' existing view
			// (there will be a DOM element with the HTML attribute data-view="Header.Logo")
			// more documentation of the Extensibility API in
			// <https://system.netsuite.com/help/helpcenter/en_US/APIs/SuiteCommerce/Extensibility/Frontend/index.html>

			/** @type {LayoutComponent} */
			var layout = container.getComponent('Layout');
			if(layout)
			{
				layout.addChildView('Addresses.Collection', function() {
					return new MyView(container);
				});
			}

			else
      {

        // This option is what you would do if you don't have access to the above two methods
        // The main customization is the modification of the price view prototype to add to the childViews object
        // Instead of adding a new child view, you could also just add new properties to the view's context object
        AddressListView.prototype.childViews = AddressListView.prototype.childViews || {}

        AddressListView.prototype.childViews.MyView = function ()
        {
          // One of the things that's quite different about the `addChildView()` method on components in the extensibility API, and adding new views directly to the `childViews` property of a view is anything you pass to the constructor in `addChildView()` gets added to the view instance's `options` object; whereas anything you add to the constructor of a view passed into `childViews` gets added automatically as those properties.
          // In other words, the following method lets us set the `application` and `model` properties directly, whereas we have to set them in the view file after passing them in as options.`
          return new MyView
          ({
            application: container
            // Because we're extending the view object the scope of `this` gets set to the class itself, which means that we don't need to faff around trying to set it: we can just pass it on from the price view
          , model: this.model
          })
        }

        // The plugin container can be used to modify a view's template at various stages of compilation or rendering.
        AddressListView.prototype.preRenderPlugins = AddressListView.prototype.preRenderPlugins || new PluginContainer();

        AddressListView.prototype.preRenderPlugins.install
        ({
          name: 'MyViewContainer'
        , execute: function ($el, view)
          {
						debugger;
            $el.find('.address-list-default-addresses').after('<div data-view="MyView"></div>');
            return $el
          }
        });
      }
		}