Как получить высоту браузера в Mithril.js для динамического размещения

Итак, у меня есть выпадающий список, и я пытаюсь придать ему динамический рост; Как это будет возможно с помощью mithril.js?

Это то, что я пробовал до сих пор: это фрагмент кода, в котором я пытаюсь придать списку динамическую высоту. Конечная цель состоит в том, чтобы иметь список динамической высоты, чтобы на фиксированной панели навигации я мог сделать ее прокручиваемой с помощью overflow-y:scroll,

var h = window.innerHeight || document.documentElement.clientHeight|| document.body.clientHeight;

m("ul.nav-dropdown-menu", {
    style: { height: h+"px" },
    className: ctrl.isOpen ? 'is-open' : 'is-closed',
});

1 ответ

Вычисление размеров окна / тела / элемента должно быть выполнено после отображения страницы. Вам понадобится config атрибут, который позволяет манипулировать DOM после того, как Mithril рендерит страницу. Вы можете прочитать о здесь: http://lhorie.github.io/mithril/mithril.html

Вы можете сделать что-то вроде этого: http://jsbin.com/woxuku/1/edit?js,output

App = {}

App.controller = function (attrs) {

}

App.view = function (ctrl, attrs) {
  return m("div.app", {
    style: {
      position: 'absolute',
      height: '300px',
      width: '400px',
      backgroundColor: 'lightblue'
    }
  }, [
    "navbar",
    m('nav', {
      style: {
        position: 'relative',
        backgroundColor: 'yellow'
      },
      config: function(el, isInit, context){
        el.style.height = ($('.app').getBoundingClientRect().height / 2).toString() + 'px'
        el.style.width = ($('.app').getBoundingClientRect().width / 2).toString() + 'px'
      }
    }, 'menu')
  ])
}

m.mount(document.body, App)
Другие вопросы по тегам