zoukankan      html  css  js  c++  java
  • 057——VUE中vue-router之路由参数默认值的设置

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>vue-router之路由参数默认值的设置</title>
        <script src="vue.js"></script>
        <script src="vue-router.js"></script>
    </head>
    <body>
    <div id="demo">
        <router-link to="/content">链接</router-link>
        <router-view></router-view>
    </div>
    <script type="text/x-template" id="content">
        <div>
            id:{{id}}
        </div>
    </script>
    <script>
        const content = {
            template: "#content",
            data() {
                return {
                    id:0
                }
            },
            mounted() {
                this.id = this.$route.params.id;
                if (!this.id) {
                    this.id = 1;
                }
            }
        }
        let routes=[
            {path:'/content/:id?',component:content}
        ]
        let router=new VueRouter({routes});
        new Vue({
            el:"#demo",
            router
        });
    </script>
    </body>
    </html>
    

      

  • 相关阅读:
    UML_04_时序图
    UML_03_类图
    UML_02_概述
    UML_00_资源帖
    UML_01_画图工具
    SpringCloud_00_资源帖
    Idea_03_常用快捷键
    Idea_02_常用配置
    Idea_01_安装与激活
    Codeforces命令行工具
  • 原文地址:https://www.cnblogs.com/yiweiyihang/p/8303322.html
Copyright © 2011-2022 走看看