mirror of
https://github.com/kataras/iris.git
synced 2025-01-23 10:41:03 +01:00
add example for https://github.com/kataras/iris/issues/1653
This commit is contained in:
parent
cc7e3860f2
commit
0069bccd75
|
@ -101,6 +101,7 @@
|
|||
* [Embedding Gzipped Files Into App Executable File](file-server/embedding-gzipped-files-into-app/main.go)
|
||||
* [Send Files (rate limiter included)](file-server/send-files/main.go)
|
||||
* Single Page Applications
|
||||
* [Vue Router](file-server/spa-vue-router)
|
||||
* [Basic SPA](file-server/single-page-application/basic/main.go)
|
||||
* [Embedded Single Page Application and `iris.PrefixDir`](file-server/single-page-application/embedded-single-page-application/main.go)
|
||||
* [Embedded Single Page Application with other routes](file-server/single-page-application/embedded-single-page-application-with-other-routes/main.go)
|
||||
|
|
|
@ -0,0 +1,4 @@
|
|||
.router-link-active {
|
||||
color: red;
|
||||
}
|
||||
|
30
_examples/file-server/spa-vue-router/frontend/index.html
Normal file
30
_examples/file-server/spa-vue-router/frontend/index.html
Normal file
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Iris + Vue Router</title>
|
||||
<script src="https://unpkg.com/vue/dist/vue.js"></script>
|
||||
<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
|
||||
<link rel="stylesheet" href="/css/page.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app">
|
||||
<h1>Hello App!</h1>
|
||||
<p>
|
||||
<!-- use router-link component for navigation. -->
|
||||
<!-- specify the link by passing the `to` prop. -->
|
||||
<!-- `<router-link>` will be rendered as an `<a>` tag by default -->
|
||||
<router-link to="/foo">Go to Foo</router-link>
|
||||
<router-link to="/bar">Go to Bar</router-link>
|
||||
</p>
|
||||
<!-- route outlet -->
|
||||
<!-- component matched by the route will render here -->
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
<script src="/js/app.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
33
_examples/file-server/spa-vue-router/frontend/js/app.js
Normal file
33
_examples/file-server/spa-vue-router/frontend/js/app.js
Normal file
|
@ -0,0 +1,33 @@
|
|||
// 0. If using a module system (e.g. via vue-cli), import Vue and VueRouter
|
||||
// and then call `Vue.use(VueRouter)`.
|
||||
|
||||
// 1. Define route components.
|
||||
// These can be imported from other files
|
||||
const Foo = { template: '<div>foo</div>' }
|
||||
const Bar = { template: '<div>bar</div>' }
|
||||
|
||||
// 2. Define some routes
|
||||
// Each route should map to a component. The "component" can
|
||||
// either be an actual component constructor created via
|
||||
// `Vue.extend()`, or just a component options object.
|
||||
// We'll talk about nested routes later.
|
||||
const routes = [
|
||||
{ path: '/foo', component: Foo },
|
||||
{ path: '/bar', component: Bar }
|
||||
]
|
||||
|
||||
// 3. Create the router instance and pass the `routes` option
|
||||
// You can pass in additional options here, but let's
|
||||
// keep it simple for now.
|
||||
const router = new VueRouter({
|
||||
routes // short for `routes: routes`
|
||||
})
|
||||
|
||||
// 4. Create and mount the root instance.
|
||||
// Make sure to inject the router with the router option to make the
|
||||
// whole app router-aware.
|
||||
const app = new Vue({
|
||||
router
|
||||
}).$mount('#app')
|
||||
|
||||
// Now the app has started!
|
32
_examples/file-server/spa-vue-router/main.go
Normal file
32
_examples/file-server/spa-vue-router/main.go
Normal file
|
@ -0,0 +1,32 @@
|
|||
// Package main simply shows how you can getting started with Iris and Vue Router.
|
||||
// Read more at: https://router.vuejs.org/guide/#html
|
||||
package main
|
||||
|
||||
import "github.com/kataras/iris/v12"
|
||||
|
||||
func main() {
|
||||
app := iris.New()
|
||||
app.HandleDir("/", "./frontend")
|
||||
|
||||
app.Listen(":8080")
|
||||
}
|
||||
|
||||
/* For those who want to use HTML template as the index page
|
||||
and serve static files in the root request path
|
||||
and use vue router as the main router of the entire application,
|
||||
please follow the below code example:
|
||||
|
||||
func fullVueRouter() {
|
||||
app := iris.New()
|
||||
app.RegisterView(iris.HTML("./views", ".html"))
|
||||
app.OnAnyErrorCode(index)
|
||||
app.HandleDir("/", "./frontend")
|
||||
app.Get("/", index)
|
||||
|
||||
app.Listen(":8080")
|
||||
}
|
||||
|
||||
func index(ctx iris.Context) {
|
||||
ctx.View("index.html")
|
||||
}
|
||||
*/
|
Loading…
Reference in New Issue
Block a user