解决方法:加native
最新

methods: {
nav_click: function() {

console.log(1)
}
}

最新

methods: {
nav_click: function() {

console.log(1)
}
}
解释:解释:解释:1: 因为它是自定义标签,根本就没有事件和方法,所以不触发,加个native 就是告诉vue 这个标签现在有主了 它是H5标签 可以加事件了。2:父组件要想在子组件监听自己的click事件就得加native,router-link是标签啊。哪里有父组件????router-link 其实就是一个封装好的 .vue 组件,所以需要 加.native修饰符才能绑定事件补充知识:Vue router-link使用的坑补充知识:补充知识:Vue router-link使用的坑####最近上手VUE,整体配置全部使用默认的配置,但是Route-link就是不跳转这是我src的项目目录这是router/index.js的代码,虽然和网上搜的其他的代码截图,整体没毛病,声明并导出了Vue-router的实例
import Vue from 'vue'
import Router from 'vue-router'
import Main from '@/components/Main'
import Attend from '@/components/Attend'

Vue.use(Router)
export default new Router({
mode: 'history',
routes: [

{

path: '/Main',

name: 'Main',

component: Main


},

{

path: '/Attend',

name: 'Attend',

component: Attend


},

{

path:'/',

redirect:"Main"

}
]
})
import Vue from 'vue'
import Router from 'vue-router'
import Main from '@/components/Main'
import Attend from '@/components/Attend'

Vue.use(Router)
export default new Router({
mode: 'history',
routes: [

{

path: '/Main',

name: 'Main',

component: Main


},

{

path: '/Attend',

name: 'Attend',

component: Attend


},

{

path:'/',

redirect:"Main"

}
]
})这是main.js的代码,需要注意的是,import router这里不能修改成其他名字
import Vue from 'vue'
import App from './App'
import router from './router'

Vue.config.productionTip = false;//阻止Vue在正式运行时发出生产提示

/* eslint-disable no-new */
Vue.component
new Vue({

el: '#app',

router,

components: { App },

template: '',//在页面引用
})


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

Vue.config.productionTip = false;//阻止Vue在正式运行时发出生产提示

/* eslint-disable no-new */
Vue.component
new Vue({

el: '#app',

router,

components: { App },

template: '',//在页面引用
})

到了关键点了测试使用router-link

找了好久才发现:to后面的用法我一直出错的地方是在main.js中引入的Main和Attend包括了组件的全路径,当时跟着一个教程做的,然后我再声明path时直接写的是 path:‘/',我以为会直接找到,后来调试了好久才回过神来不对,需要改成path:'/Main',即对应的.vue才可以,小问题折腾了好久,记下来以上这篇解决Vue router-link绑定事件不生效的问题就是小编分享给大家的全部内容了,希望能给大家一个参考。