Свойство с типом render-variant предназначено для отображения и смены внутри себя различных компонентов. Это может быть массив
, контейнер
с renderType = "container-outer", либо контейнер
из виртуального массива. При инициализации приложения htmlix добавляет ссылку на отображаемый компонент в поле renderChild. Для смены компонента достаточно вызвать метод setProp("имя-компонента"), либо setProp("ссылка-на-контейнер-виртуального-массива"). Предыдущий компонент станет невидимым, а новый отобразится в данном свойстве, если это контейнер из виртуального массива то он будет удален. Можно также не только поменять отображаемый в свойстве компонент но и установить новые значения для его свойств:
setProp({ componentName: "имя_отображаемого_компонента", prop1: "данные_свойства_1", prop2: "данные_свойства_2", и т.д.}) - если отображаемый компонент является контейнером.
setProp({ componentName: "имя_отображаемого_компонента", data: [ { prop1: "данные_свойства_1", prop2: "данные_свойства_2", и т.д.}, { prop1: "данные_свойства_1", prop2: "данные_свойства_2", и т.д.} ]) - если отображаемый компонент является массивом.
Открыв в консоли свойство с типом render-variant в нем будут следующие поля:
renderChild
- ссылка на текущий компонент отображаемый в данном свойстве;В отображаемом компоненте также добавилось поле renderParent
renderParent
- ссылка на свойство в котором отображается данный компонент;Также у свойства с типом render-variant есть несколько дополнительных методов:
.render(nameComponent=string)
- отображает компонент с именем "nameComponent" (используется только для отображения компонентов)
.renderByContainer(containerLink=container)
- отображает контейнер из виртуального массива по ссылке (используется только для отображения контейнеров из виртуальных массивов);
.setOrCreateAndRender(objWidthProps)
- меняет отображаемый компонента на objWidthProps.componentName и устанавливает ему новые значения свойств;
objWidthProps - объект с новыми значениями для свойств, где имена ключей объекта должны совпадать с названиями устанавливаемых свойств, objWidthProps.componentName - обязательное поле объекта, которое содержит имя отображаемого компонента, если отображаемый компонент является контейнером из виртуального массива здесь указывается имя виртуального массива. Если отображаемый компонент является обычным массивом, здесь также нужно указать поле data - массив с объектами, ключами которых являются новые свойства для контейнеров.
если objWidthProps.componentName
- обычный контейнер(renderType="container-outer") - устанавливает ему свойства совпавшие с ключами в объекте objWidthProps,
вызвав у него метод setAllProps(objWidthProps)
а затем метод render(objWidthProps.componentName)
;
если objWidthProps.componentName
- виртуальный массив(renderType="virtual-array") то удалит старый отображаемый контейнер в свойстве и создаст новый из виртуального массива вызвав метод массива container=componentName.add(objWidthProps)
затем вызовет метод .renderByContainer(containerLink=container)
,
если objWidthProps.componentName
- обычный массив(renderType="array"), отображает в свойстве данный массив и вызывает у него метод reuseAll(objWidthProps.data)
,
передав в него массив data
из объекта objWidthProps
с новыми данными для контеййнеров.
.setProp(newElement) - метод определит тип данных и затем вызовет нужный метод из перечисленных выше,
.getProp() - если отображаемый элемент является контейнером, вызывает у него метод .getAllProps(), если отображаемый элемент является массивом, вызывает у него метод метод .getAll(),
тем самым получает значения всех свойств из отображаемого элемента, если передать параметром mapObject={key1: "", key2: {ke1: ""} } .getProp(mapObject)
,
вернет свойства только совпадающие по названиям с key, таким образом можно получить развернутый объект со всеми значениями свойств либо со всеми нужными значениями свойств из отображаемого элемента;
.removeProp() - убирает компонент из видимости, если это контейнер из виртуального массива (renderType == "container-inner") удаляет его;