{"action":"created","issue":{"url":"https://api.github.com/repos/charlieduong94/marko-path-router/issues/34","repository_url":"https://api.github.com/repos/charlieduong94/marko-path-router","labels_url":"https://api.github.com/repos/charlieduong94/marko-path-router/issues/34/labels{/name}","comments_url":"https://api.github.com/repos/charlieduong94/marko-path-router/issues/34/comments","events_url":"https://api.github.com/repos/charlieduong94/marko-path-router/issues/34/events","html_url":"https://github.com/charlieduong94/marko-path-router/issues/34","id":303484011,"number":34,"title":"Navigation error on nested routes","user":{"login":"jesse1983","id":2489514,"avatar_url":"https://avatars1.githubusercontent.com/u/2489514?v=4","gravatar_id":"","url":"https://api.github.com/users/jesse1983","html_url":"https://github.com/jesse1983","followers_url":"https://api.github.com/users/jesse1983/followers","following_url":"https://api.github.com/users/jesse1983/following{/other_user}","gists_url":"https://api.github.com/users/jesse1983/gists{/gist_id}","starred_url":"https://api.github.com/users/jesse1983/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/jesse1983/subscriptions","organizations_url":"https://api.github.com/users/jesse1983/orgs","repos_url":"https://api.github.com/users/jesse1983/repos","events_url":"https://api.github.com/users/jesse1983/events{/privacy}","received_events_url":"https://api.github.com/users/jesse1983/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":4,"created_at":"2018-03-08T13:44:50Z","updated_at":"2018-03-20T19:35:25Z","closed_at":"2018-03-20T00:28:30Z","author_association":"NONE","body":"Hello. I've just found a problem about navigation.\r\n\r\n`src/index.marko`:\r\n\r\n```marko\r\n<!-- Routes -->\r\n$ const routes = [{ path: '/admin', component: require('./components/home'), nestedRoutes: [\r\n        { path: '/categories', component: require('./components/home/components/categories'), nestedRoutes: [\r\n            { path: '/furniture', component: require('./components/home/components/categories/components/furniture') },        \r\n            { path: '/beauty', component: require('./components/home/components/categories/components/beauty') },        \r\n        ]},\r\n        { path: '/users', component: require('./components/home/components/users') },\r\n    ]\r\n}];\r\n\r\n<!-- HTML -->\r\ndiv.my-app.container\r\n  div.app-header\r\n    h1.display-1 -- marko-path-router\r\n    div.row\r\n      div.col\r\n        nav.nav.flex-column\r\n          router-link class=\"nav-link\" path='/admin' -- Home\r\n          router-link class=\"nav-link\" path='/admin/categories' -- Categories        \r\n          nav.nav.flex-column\r\n            router-link class=\"nav-link ml-3\" path='/admin/categories/furniture' -- Furniture        \r\n            router-link class=\"nav-link ml-3\" path='/admin/categories/beauty' -- Beauty                    \r\n          router-link class=\"nav-link\" path='/admin/users' -- Users                 \r\n      div.col-10 no-update\r\n        router routes=routes initialRoute=window.location.pathname\r\n```\r\n\r\n`/admin`\r\n![image](https://user-images.githubusercontent.com/2489514/37152483-41947d7e-22b8-11e8-855d-c8eeadd1117a.png)\r\n\r\n\r\nClick on `Furniture`, for example `/admin/categories/furniture`:\r\n![image](https://user-images.githubusercontent.com/2489514/37152556-7ef6eed6-22b8-11e8-9f7d-bb508bd8015d.png)\r\n\r\nSo far so good. 👍\r\n\r\n---\r\n\r\n## Bug\r\n\r\nHowever, some navigations `only change navigation path`, but do not `render a component`.\r\n\r\nBelow are some navigation examples. Follow these sequences:\r\n\r\n👍 `Home > Categories > Furniture > Beauty`\r\n👍 `Home > Users` \r\n🚫 `Beauty > Categories > Home > Categories`  - Navigation path changed, but component not rendered\r\n🚫 `Categories  > Home > Furniture`  - Navigation path changed, but component not rendered\r\n👍 `Categories  > Home > Furniture > Users`  - When click on 'Users', the problem is solved (yes, it's very strange)\r\n\r\nThis code is available on [https://github.com/jesse1983/marko-path-router-issue](https://github.com/jesse1983/marko-path-router-issue). \r\n\r\nFeel free to download and make a pull request.\r\n\r\nDoes anybody can help me?\r\n\r\nThank you.\r\n"},"comment":{"url":"https://api.github.com/repos/charlieduong94/marko-path-router/issues/comments/374728928","html_url":"https://github.com/charlieduong94/marko-path-router/issues/34#issuecomment-374728928","issue_url":"https://api.github.com/repos/charlieduong94/marko-path-router/issues/34","id":374728928,"user":{"login":"jesse1983","id":2489514,"avatar_url":"https://avatars1.githubusercontent.com/u/2489514?v=4","gravatar_id":"","url":"https://api.github.com/users/jesse1983","html_url":"https://github.com/jesse1983","followers_url":"https://api.github.com/users/jesse1983/followers","following_url":"https://api.github.com/users/jesse1983/following{/other_user}","gists_url":"https://api.github.com/users/jesse1983/gists{/gist_id}","starred_url":"https://api.github.com/users/jesse1983/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/jesse1983/subscriptions","organizations_url":"https://api.github.com/users/jesse1983/orgs","repos_url":"https://api.github.com/users/jesse1983/repos","events_url":"https://api.github.com/users/jesse1983/events{/privacy}","received_events_url":"https://api.github.com/users/jesse1983/received_events","type":"User","site_admin":false},"created_at":"2018-03-20T19:35:25Z","updated_at":"2018-03-20T19:35:25Z","author_association":"NONE","body":"@charlieduong94 Thank you for your attention.\r\n\r\nI've installed the last version. It works on my repo, but on my project the bug's still there. 🤔 \r\n\r\nI've been searching for differences between my project and the repo, and I found something: ***state changes on parent components***.\r\n\r\nFor example, the file `/src/components/home/index.marko` was:\r\n```\r\ndiv.admin\r\n    if(input.renderBody)\r\n        include(input.renderBody)\r\n```\r\nThen, I add state attributes and the bug shows up:\r\n\r\n```\r\nclass {\r\n    onCreate() {\r\n        this.state = { name: '' }\r\n    }\r\n    onMount() {\r\n        this.setState({ name: 'foo bar' });\r\n    }\r\n}\r\n\r\ndiv.admin \r\n    h1 -- Welcome, ${ state.name }\r\n    if(input.renderBody)\r\n        include(input.renderBody)\r\n```\r\n\r\nI think that the problem only happens when I add `this.setState(...)` or `this.state = ...` on parent components.\r\n\r\nThe repo is updated. \r\n\r\nThank you.\r\n\r\n\r\n"}}
{"actor":{"display_login":"jesse1983"}}