2017-02-15 36 views
0

私はMithril.jsを使用して1つのページアプリケーションとして自分のウェブサイト/ブログを作成しています。私のウェブサイトのすべてのページとブログの投稿は、PagePostの要素を使ってレンダリングされ、正しいページはURLの:slugに基づいて読み込まれます。ルートが変更されたときにミスリルのコンポーネントが更新されない

私が持っている問題はです。ページ間で切り替えようとするたびに、は更新されません。 PagePostコンポーネントを交互に使用しているため、ページと投稿を切り替えると機能します。しかし、同じコンポーネントを2回連続して使用しようとすると、ページからページに移動すると、Webページは更新されません。ここ

m.route(document.body, '/', { 
    // `Home` is a wrapper around `Page` 
    // so I can route to `/` instead of `/home` 
    '/': Home, 
    '/:slug': Page, 
    '/blog/:slug': Post 
}); 
const Home = { 
    view() { 
    return m(Page, { slug: 'home' }); 
    } 
}; 

Page成分(Post成分は非常に類似している)です。両方のコンポーネントが正しくレンダリングされます。

const Page = { 
    content: {}, 
    oninit(vnode) { 
    m.request({ 
     method: 'GET', 
     url: 'content.json', 
    }).then((response) => { 
     Page.content = response.pages[vnode.attrs.slug]; 
    }); 
    }, 
    view() { 
    if (Page.content) { 
     return [ 
     m('#content', m.trust(Page.content.body)) 
     ]; 
    } 
    } 
}; 

スズメルが変更されたことをミスリルが認識しないのはなぜですか?

答えて

0

docs page for m.routeには解決策があります。

ユーザは異なるパラメータで同じ経路にパラメータ化された経路からナビゲート(例えば、経路/page/:id所与/page/1から/page/2に行く両方の経路が同一の構成要素に解決するため、成分が最初から再作成されませんしたがって、仮想ドームのインプレースdiffが発生します。oninit/oncreateではなく、onupdateフックをトリガーするという副作用がありますが、開発者は、コンポーネントのレクリエーションを経路変更イベント

+1

ありがとう!私はちょうどc ':slug'を ':key'に吊り下げ、今は動作します! :) – evanrelf

関連する問題