$subview in tabview

Webix JS
#1

Please, what am I doing wrong? The first cell of my Tabview imports from a separate module, device_details_view.js. (The other two Tabview cells are just templates, as you can see.) When I first click on Tab #1, Cell #1 displays correctly. But if I then click on another tab, then click back to Tab #1, Cell #1 does not display and I can’t get it back.

import {JetView} from "webix-jet";
import {DetailsView} from "./device_details_view.js"
export default class UnitView extends JetView {
  config() {
    var tabView = {
      view: "tabview",
      animate: true,
      localId: "tabviewLocalId",
      id: "tabviewGlobalId",
      cells: [
        {
          header: "Details",
          body:
          {
            id: "detailsTabviewBody",
            $subview: "device_details_view", name: 'detailsTabviewBody'
          }
        },
        {
          header: "Events",
          body: {
            id: "eventsTabviewBody",
            template: "This is tab 2"
          }
        },
        {
          header: "Charts",
          body: {
            id: "chartsTabviewBody",
            template: "This is tab 3",
          }
        }
      ]
    }
    var userInterface = tabView

    return userInterface
  } //end of config()

  init() {
  }

}
#2

Hello @re_404,

When I first click on Tab #1, Cell #1 displays correctly. But if I then click on another tab, then click back to Tab #1, Cell #1 does not display and I can’t get it back.

Going off your initial config, I don’t see anything wrong in particular. The only thing I would like to point to would be the subview reference in the first cell:

{
  id: "detailsTabviewBody",
  $subview: "device_details_view", name: 'detailsTabviewBody'
}

Here, the $subview should point to the imported view, in your case it should be the DetailsView:

{
  id: "detailsTabviewBody",
  $subview: DetailsView, name: 'detailsTabviewBody'
}

Overall, when putting subviews into a tabview you do not need IDs, you simply can import the subviews and place them into the body of tabview cells directly:

cells: [
  {
    header: "Details",
    body: DetailsView
  },
  ...
]

That aside, the issue might be related to the imported view and its config directly. Could you please provide the config for the imported DetailsView view?