Vue Router Webpack Dot in Params

我正在使用Vue Cli和webpack爲後臺創建一個應用程序，使用NodeJS/Express創建應用程序併爲前臺創建VueJS。Vue Router Webpack Dot in Params

我想知道是否有辦法讓我的路線PARAMS點。

這裏是我所得到的，當我沒有配置

這裏嘗試是我/src/main.js

import Vue from 'vue' 
import App from './App.vue' 

import VueRouter from 'vue-router' 
import VueResource from 'vue-resource' 
import VueAutosize from 'vue-autosize' 

import Main from './components/Main.vue' 
import Signin from './components/Signin.vue' 

// We want to apply VueResource and VueRouter 
// to our Vue instance 
Vue.use(VueRouter) 
Vue.use(VueResource) 
Vue.use(VueAutosize) 

const router = new VueRouter({ 
    history: true 
}) 

// Pointing routes to the components they should use 
router.map({ 
    '/t/:person': { 
    component: Main 
    }, 
    '/signin': { 
    component: Signin 
    } 
}) 

router.beforeEach(function (transition) { 
    if (transition.to.path === '/signin' && window.localStorage.length !== 0) { 
    transition.redirect('/') 
    } else if (transition.to.path === '/' && window.localStorage.length === 0) { 
    transition.redirect('/signin') 
    } else { 
    transition.next() 
    } 
}) 

// Any invalid route will redirect to home 
router.redirect({ 
    '*': '/404' 
}) 

router.start(App, '#app')

來源

2016-12-06 utiiz

我相信vue-router會將url中的param轉換成javascript對象，所以不允許使用點。但我用其他標點符號進行測試，沒關係。如果你想> [https://github.com/vuejs/vue-router/blob/9649929b3646954c7b59d149c570c3d0a96379c9/examples/route-matching/app.js](https://github.com/），你可以使用regexp或optionnal參數vuejs/vue-router/blob/9649929b3646954c7b59d149c570c3d0a96379c9/examples/route-matching/app.js） –

@utiiz您是否找到解決方案？我也有同樣的問題。 –

這與Webpack有什麼關係？ –

我正在處理同樣的問題，甚至我談話晚了，也許有人會找到我找到的解決方案。

它似乎是webpack的錯。

如果使用vue-cli的webpack模板，您需要爲您需要的路由配置代理。例如，在您的情況，您需要將其添加到config/index.js文件：

... 
dev: { 
    ... 
    proxyTable: { 
    '/t/*.*': { // this will match all urls with dots after '/t/' 
     target: 'http://localhost:8080/', // send to webpack dev server 
     router: function (req) { 
     req.url = 'index.html' // Send to vue app 
     } 
    } 
    // Any other routes you need to bypass should go here. 
    } 
    ... 
}, 
...

這樣的WebPack將代理到該網址的所有請求，並沒有把這些作爲文件。

來源

2018-01-21 06:00:29 PGGalaviz

Vue Router Webpack Dot in Params

回答

相關問題