• 前端vue组件传参


    ## 路由传参
    """
    转跳:
    <router-link :to="'/course/'+course.id">{{course.name}}</router-link>
    路由:
    {
        path: '/course/:course_id',
        name: 'detail',
        component: Detail
    }
    获取:
    this.$route.params.course_id
    """"""
    转跳:
    <router-link :to="{name: 'detail', params: {id: course.id}}">{{course.name}}</router-link>
    路由:
    {
        path: '/detail',
        name: 'detail',
        component: Detail
    }
    获取:
    this.$route.params.id
    """"""
    转跳:
    <router-link @click="routeAction(course.id)">{{course.name}}</router-link>
    
    routeAction(course_id) {
        this.$router.push({
            name: 'detail',
            params: {
                id: course_id
            }
        })
    }
    路由:
    {
        path: '/detail',
        name: 'detail',
        component: Detail
    }
    获取:
    this.$route.params.id
    """## 仓库传参
    """
    仓库:
    export default new Vuex.Store({
        state: {
            course_id: 0
        },
        mutations: {
            set_course_id (state, value) {
                state.course_id = value
            }
        },
        actions: {}
    })
    
    传递:
    routeAction(course_id) {
        this.$router.push('detail')
        this.$store.commit('set_course_id', course_id);
    }
    路由:
    {
        path: '/detail',
        name: 'detail',
        component: Detail
    }
    获取:
    create() {
        window.console.log(this.$store.state.course_id)
    }
    
    """
    
  • 相关阅读:
    LeetCode 137. Single Number II
    LeetCode 16. 3Sum Closest
    LeetCode 18. 4Sum
    LeetCode 15. 3Sum
    LeetCode 166. Fraction to Recurring Decimal
    LeetCode Anagrams
    Java: Difference between ArrayList and LinkedList
    LeetCode 242. Valid Anagram
    LeetCode 204. Count Primes
    Java Class Variable/Static Variable
  • 原文地址:https://www.cnblogs.com/lakei/p/11228248.html
Copyright © 2020-2023  润新知