Skip to content

Instantly share code, notes, and snippets.

@minskmaz minskmaz/routes.js Secret
Last active Jun 10, 2019

Embed
What would you like to do?
F7 componentUrl problem
import HomePage from './pages/home.f7.html';
import AboutPage from './pages/about.f7.html';
import FormPage from './pages/form.f7.html';
import DynamicRoutePage from './pages/dynamic-route.f7.html';
import NotFoundPage from './pages/not-found.f7.html';
import PanelLeftPage from './pages/panel-left.f7.html';
import PanelRightPage from './pages/panel-right.f7.html';
export default [
{
path: '/',
component: HomePage,
tabs: [
{
path: '/',
id: 'tab-1',
content: ' \
<div class="block"> \
<p>Tab 1 content</p> \
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ullam enim quia molestiae facilis laudantium voluptates obcaecati officia cum, sit libero commodi. Ratione illo suscipit temporibus sequi iure ad laboriosam accusamus?</p> \
<p>Saepe explicabo voluptas ducimus provident, doloremque quo totam molestias! Suscipit blanditiis eaque exercitationem praesentium reprehenderit, fuga accusamus possimus sed, sint facilis ratione quod, qui dignissimos voluptas! Aliquam rerum consequuntur deleniti.</p> \
<p>Totam reprehenderit amet commodi ipsum nam provident doloremque possimus odio itaque, est animi culpa modi consequatur reiciendis corporis libero laudantium sed eveniet unde delectus a maiores nihil dolores? Natus, perferendis.</p> \
</div> \
',
},
{
path: '/tab-2/',
id: 'tab-2',
content: '\
<div class="block"> \
<p>Tab 2 content</p> \
<p>Suscipit, facere quasi atque totam. Repudiandae facilis at optio atque, rem nam, natus ratione cum enim voluptatem suscipit veniam! Repellat, est debitis. Modi nam mollitia explicabo, unde aliquid impedit! Adipisci!</p> \
<p>Deserunt adipisci tempora asperiores, quo, nisi ex delectus vitae consectetur iste fugiat iusto dolorem autem. Itaque, ipsa voluptas, a assumenda rem, dolorum porro accusantium, officiis veniam nostrum cum cumque impedit.</p> \
<p>Laborum illum ipsa voluptatibus possimus nesciunt ex consequatur rem, natus ad praesentium rerum libero consectetur temporibus cupiditate atque aspernatur, eaque provident eligendi quaerat ea soluta doloremque. Iure fugit, minima facere.</p> \
</div> \
',
},
{
path: '/tab-3/',
id: 'tab-3',
componentUrl:'./component/tab-3.html',
},
],
},
{
path: '/panel-left/',
component: PanelLeftPage,
},
{
path: '/panel-right/',
component: PanelRightPage,
},
{
path: '/about/',
component: AboutPage,
},
{
path: '/form/',
component: FormPage,
},
{
path: '/dynamic-route/blog/:blogId/post/:postId/',
component: DynamicRoutePage,
},
{
path: '(.*)',
component: NotFoundPage,
},
];
<!-- component template -->
<template>
<div>HELLO WORLD</div>
</template>
<style>
div {
background-color: red;
}
</style>
<script>
return {}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.