首页 > 其他 > 详细

vue项目功能

时间:2019-03-01 21:39:41      阅读:155      评论:0      收藏:0      [点我收藏+]

vue-router

        {
            path: ‘/‘,
            name: ‘home‘,
            // 路由的重定向
            redirect: ‘/home‘
        }
        {
            // 一级路由, 在根组件中被渲染, 替换根组件的<router-view/>标签
            path: ‘/one-view‘,
            name: ‘one‘,
            component: () => import(‘./views/OneView.vue‘)
        }
        {
            // 多级路由, 在根组件中被渲染, 替换根组件的<router-view/>标签
            path: ‘/one-view/one-detail‘,
            component: () => import(‘./views/OneDetail.vue‘),
            // 子路由, 在所属路由指向的组件中被渲染, 替换该组件(OneDetail)的<router-view/>标签
            children: [{
                path: ‘show‘,
                component: () => import(‘./components/OneShow.vue‘)
            }]
        }
 
 
 
 
 
router-link
  <!-- router-link渲染为a标签 -->
        <router-link to="/">Home</router-link> |
        <router-link to="/about">About</router-link> |
        <router-link :to="{name: ‘one‘}">One</router-link> |
        <!-- 为路由渲染的组件占位 -->
        <router-view />
 
        a.router-link-exact-active {
            color: #42b983;
        }
 
        // router的逻辑转跳
        this.$router.push(‘/one-view‘)
        // router采用history方式访问上一级
        this.$router.go(-1)
 
 
 
vuex
        // 在任何一个组件中,均可以通过this.$store.state.msg访问msg的数据
        // state永远只能拥有一种状态值
        state: {
            msg: "状态管理器"
        },
        // 让state拥有多个状态值
        mutations: {
            // 在一个一个组件中,均可以通过this.$store.commit(‘setMsg‘, new_msg)来修改state中的msg
            setMsg(state, new_msg) {
                state.msg = new_msg
            }
        },
        // 让mutations拥有多个状态值
        actions: {
        }
 
 
 
 
 
 
 
 
 
 
 
 

vue项目功能

原文:https://www.cnblogs.com/yanhui1995/p/10458844.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!