vue-router

Vue router报错：NavigationDuplicated {_name: \"NavigationDuplicated\", name: \"NavigationDuplicated\"}的解决方法

由 ￡可爱￡侵袭症＋ 提交于 2019-12-24 02:07:18
点击没问题 如果在这个点击页面 在点击一次router -link 就会报这个错 但是不影响功能 去你引用vue -router的页面添加一段代码 import Vue from 'vue' import Router from 'vue-router' import routes from './router.js' Vue.use(Router) const originalPush = Router.prototype.push Router.prototype.push = function push (location) { return originalPush.call(this, location).catch(err => err) } export default new Router({ routes: routes }) 来源： https://www.cnblogs.com/jvziking/p/11507556.html

Two way binding between controller in routerview and parent

由 拈花ヽ惹草 提交于 2019-12-24 00:39:49
问题 I have a single page application which consists of a: A navigation component which contains a title and a menu A router-view I'd like each component being presented in the router view which correspond to a state in the router, to update the title of the navigation component. How to go about passing the parameters from the components in the router-view to the outer navigation component. I'm using vue 2.0 回答1: I would recommending Vuex for this: https://github.com/vuejs/vuex This way you can

VUE JS 2 + WEBPACK Cannot read property 'get' of undefined VUE RESOURCE

由 心不动则不痛 提交于 2019-12-24 00:37:58
问题 I feel lost. I've used vue-cli for my project. I've vuerouter installed. Everything is ok. I want to use view resource in a vue component but i can't find why it don't works. This is my main.js (i'm using webpack) import Vue from 'vue' import VueRouter from 'vue-router' var VueResource = require('vue-resource') Vue.use(VueRouter) Vue.use(VueResource) const router = new VueRouter({ routes: [{ path: '/', component: require('./components/index.vue') }, { path: '/products/stock', component:

Router View in a child of a component doesn't work

由 半城伤御伤魂 提交于 2019-12-24 00:37:26
问题 I'm trying to use this structure in my router file: { path: '/', name: 'Dashboard', component: Dashboard, children: [ { path: 'users', name: 'Users', component: Users }, { path: 'permissions', name: 'Permissions', component: Permissions }, { path: 'systems', name: 'Systems', component: Systems } ] }, But it doesn't work. The url path change but the components are not rendered. My Dashboard component template is like this: <template> <div class="container-fluid" data-ma-theme="green"> <main

Use Regex in Vue Router Paths

由 牧云@^-^@ 提交于 2019-12-23 17:31:02
问题 I am creating a VueJS app which heavily uses the vue router. Here's the structure of my routes.js : export const routes = [ { path: '', component: Poetry, children: [ { path: '', name: 'poetry', component: PoetryLanding }, { path: 'poetry/:id', name: 'poetrycard', component: PoetryCard }, { path: 'poetry/search', name: 'poetrysearch', component: PoetrySearch }, ]}, ] I want to use regex in second child component i.e. poetrycard such that it only accepts the params( :id ) which is a number. I

Vuejs: Lifecycle hooks of child routerview components using keep alive

由 ∥☆過路亽．° 提交于 2019-12-23 10:15:54
问题 I'll explain my issue in a more generalized way for the purpose of clear understanding and here is the jsFiddle I have two main routes which show two different components in the router-view Route-1 when clicked the path is: '/route-1' Route-2 when clicked the path is: '/route-2/sub-route-a' Route-2 contains a another router-view inside it which displays two sub routes that are: sub-route-a sub-route-b When Route-2 is clicked it opens the component of Route-2 with sub-route-a pre-opened in its

vue-router: Preventing routing on argument change

由 假装没事ソ 提交于 2019-12-23 10:00:31
问题 I'm trying to confirm leaving not saved form route, and if user declines, to cancel changing the route. It mostly works with beforeRouteLeave: function (to, from, next) { if (!confirm('Leaving form')) next(false); } The problem is with route arguments, like #/form-path?id=5 - changing the id argument does not trigger beforeRouteLeave . Which hook can I use to prevent navigation on argument change? 回答1: Dynamic route matching is specifically designed to make different paths or URLs map to the

Bootstrap nav pills for VueJS vue-router

由 我只是一个虾纸丫 提交于 2019-12-23 09:31:28
问题 In the bootstrap official docs I have seen a cool nav pills set. This is it. <div class="nav flex-column nav-pills" id="v-pills-tab" role="tablist" aria-orientation="vertical"> <a class="nav-link active" id="v-pills-home-tab" data-toggle="pill" href="#v-pills-home" role="tab" aria-controls="v-pills-home" aria-selected="true">Home</a> <a class="nav-link" id="v-pills-profile-tab" data-toggle="pill" href="#v-pills-profile" role="tab" aria-controls="v-pills-profile" aria-selected="false">Profile<

vue04 总结

由 浪尽此生 提交于 2019-12-23 02:34:18
""" 1、环境 node：官网下载安装包，傻瓜式安装 - https://nodejs.org/zh-cn/ => 附带按照了npm cnpm：npm install -g cnpm --registry=https://registry.npm.taobao.org vue/cli：cnpm install -g @vue/cli 2、项目创建 cd 存放项目的目录 vue create 项目名 => 需要安装的组件babel、vue-router、vuex 3、配置项目启动 pycharm打开项目，配置npm启动 4、main.js完成vue环境的加载、完成根组件的渲染、加载vue-router、vuex等环境、加载自定义环境 5、vue-router配置路由: | this.$router.push() 完成跳转 完成页面组件的占位 在router/index.js中 完成路由配置 路径-视图组件 映射关系 两种路由传参 配置 跳转 获取 path:'/user' to="/user?pk=1" $route.query.pk path:'/user/:pk' to="/user/1" $route.params.pk :to="{name: 'user'}" 6、组件生命周期钩子：组件从创建到销毁的整个生命周期中特殊时间节点回调的方法 created()

Vue.js replace hashtags in text with <router-link>

由 孤街醉人 提交于 2019-12-23 01:04:28
问题 I receive some text from server which may contain some hashtags and when displaying this text I would like to convert these tags with links. Example text is: "Today #weather is very nice" Following code converts the string to Today <router-link to="/tag/weather">#weather</router-link> is very nice but it is not rendered again to <a> tag. <template> <p v-html="content"/> </template> <script> export default { methods: { convertHashTags: function(str) { return str.replace(/#([\w]+)/g,'<router
订阅 vue-router