Vue点击按钮跳转到新路由
Vue点击按钮跳转到新路由
·
前言,点击 添加商品 按钮,跳转到新路由
1.第一步,绑定click事件
<el-button type="primary" @click="goAddPage">添加商品</el-button>
2.第二步,补充完整 goAddPage 事件
// goAddPage 点击按钮在这个函数里面跳转路由到一个新的页面
//通过路径 goods/add 跳转到新页面
goAddPage() {
this.$router.push('goods/add');
}
通过 this.$router.push('goods/add');
3、第三步,创建该组件,并在route.js中注册它
注册
import GoodsAdd from '../components/good/Add.vue'
const routes = [
{
path: '/',
redirect: '/login'
},
{
path: '/login',
component: Login
},
{
path: '/home',
component: Home,
redirect: '/welcome',
children: [{
path: '/welcome',
component: Welcome
},
{
path: '/users',
component: Users
},
,
{
path: '/rights',
component: Rights
},
{
path: '/roles',
component: Roles
},
{
path: '/categories',
component: Cate
},
{
path: '/params',
component: Params
},
{
path: '/goods',
component: GoodsList
},{
path: '/goods/add',
component: GoodsAdd
}]
}
即
{
path: '/goods/add',
component: GoodsAdd
}
更多推荐
已为社区贡献1条内容
所有评论(0)