4

我正在使用 Riot JS,在我的 index.html 中,我有 3 个自定义标签——标题、登录面板和候选面板。在我的主 app.js 中,在 $(document).ready 的回调函数中,我执行当前路由并注册一个路由更改处理函数。在我的 switchView 中,我卸载了所有自定义标签,然后尝试仅安装与正在切换的当前视图相关的标签。这是我的代码。如果我卸载,则页面上不会显示任何内容

索引.html

<body>
    <header label="Hire Zen" icon="img/user-8-32.png"></header>
    <login-panel class="viewTag" id="loginView"></login-panel>

    <candidates-panel id="candidatesView" class="viewTag"></candidates-panel>
    <script src="js/bundle.js"></script>
</body>

应用程序.js

function switchView(view) {
    if(!view || view === '') {
        view = 'login'
    }
    //unmount all other panels and mount only the panel that is required
    //TODO: unmount all view panels and mounting only required panel is not working
    //riot.unmount('.viewTag')
    riot.mount(view+'-panel')
    $('.viewTag').hide()
    $(view+'-panel').show()
}

$(document).ready(function () {
    RiotControl.addStore(new AuthStore())
    RiotControl.addStore(new CandidatesStore())
    riot.mount('header')
    //register route change handler
    riot.route(function (collection, id, action) {
        switchView(collection)
    })
    riot.route.exec(function (collection, id, action) {
        switchView(collection)
    })
})
4

3 回答 3

4

riot.js v2.1.0 的答案:

功能

riot.unmount(...)

据我所知,不可用。但是,您可以卸载已保存的标签。

mytag.unmount(true) 

来源

诀窍是记住已安装的标签,以便以后能够卸载它们:

var viewTag = riot.mount(document.getElementById('viewTag'))
viewTag.unmount(true)

您可以将所有这些视图标签存储在一个对象中并循环它们以卸载所有并仅安装活动的。

来源

于 2015-06-17T20:09:03.723 回答
1

2.3.18 的答案

基于先前的答案和本教程,我创建了以下概念:

app.currentPage = null;

var goTo = function(page){
  if (app.currentPage) {
    app.currentPage.unmount(true); //unmount and keep parent tag
  }
  app.currentPage = riot.mount(page)[0]; //remember current page
};

riot.route(function() {
  console.info("this page is not defined");
  //do nothing (alternatively go to 404 page or home)
});

riot.route('/inventory', function(){
  goTo('inventory');
});

riot.route('/options', function() {
  goTo('options');
});
于 2016-05-26T16:28:59.737 回答
1

我想你正在寻找riot.util.tags.unmountAll(tags)

如何实现目标?

索引.html

var tags = [];

some.tag.html

var some = this;
tags.push(some);

卸载AllTags.js

riot.util.tags.unmountAll(tags);
于 2017-01-09T20:35:50.067 回答