Mithril show component on button click

Question

Мне нужно разработать единую страницу приложения, я выбираю Мифрил.

мне нужно сделать компонент по нажатию кнопки, это мой код:

var accountView = { 
    controller: function (data) { 
     return { 
      showOtherPage: function() { 
       ??? how to render an other component ? 
      } 
     } 
    }, 
    view: function (ctrl) { 
     return [ 
      m("button", { onclick: ctrl.showOtherPage }, "Account") 
     ]; 
    } 
} 

Заранее спасибо

Answer 1

Если вы используете функции маршрутизации MITHRIL и хотите, чтобы показать всю новую страницу, то вы можете использовать ссылку, а не использовать кнопку. (Лично, это, как я обычно ожидать обработки этих сценариев.), Например,

m("a[href=/otherPage]", { config: m.route }, "Account") 

Fiddle: https://jsfiddle.net/11qjx341/

(В качестве альтернативы, вы можете также позвонить m.route('/otherPage') в функции showOtherPage если ссылка не подходит для некоторых причина.)

Или, если вы не используете маршрутизацию Мифрила (например, если вы используете m.mount), но все же хотите отобразить целую новую страницу, вы можете позвонить m.mount с новым представлением оказаны. например

m.mount(document.body, otherView); 

Fiddle: https://jsfiddle.net/91g9db6n/

В качестве третьего варианта, если ваш новый взгляд на самом деле имел в виду, чтобы сосуществовать с текущей страницы, вы можете иметь компонент, который отображается или скрытый на основе состояния. например

return [ 
    m("button", { onclick: ctrl.showModal.bind(ctrl, !showModal) }, showModal ? "Hide Account" : "Account") 
    , showModal ? m.component(OtherView) : null 
]; 

Fiddle: https://jsfiddle.net/mk27tfq1/