vue第六天

李昌杰發布于2019-08-21 11:31 / 1086人閱讀

摘要：路由路由通俗解釋根據不同地址，出現不同效果，一般是用來寫應用，單頁面應用這里用的是版本一個路由的基本結構跟用法引入路由文件主頁跳轉鏈接里面也是寫新聞展示內容準備一個根組件組件都準備我是主頁我是新聞準備路由關聯啟動路由是作用范圍

vue 路由

路由通俗解釋：根據不同url地址，出現不同效果，一般是用來寫SPA應用，單頁面應用

這里用的是vue-router 0.7.13版本
一個路由的基本結構跟用法：
引入路由js文件：

html:

    主頁    //跳轉鏈接,v-link里面也是寫json 
    新聞           
    
               //展示內容

js:

//1. 準備一個根組件
    var App=Vue.extend();

//2. Home News組件都準備
    var Home=Vue.extend({
        template:"我是主頁"
    });

    var News=Vue.extend({
        template:"我是新聞"
    });

//3. 準備路由
    var router=new VueRouter();

//4. 關聯
    router.map({
        "home":{
            component:Home
        },
        "news":{
            component:News
        }
    });

//5. 啟動路由:#box是作用范圍
    router.start(App,"#box");

//6.跳轉
    router.redirect({
        "/":"/home"
    });

對于多層路由如下：
html：

js：

//1. 準備一個根組件
var App=Vue.extend();

//2. Home News組件都準備
var Home=Vue.extend({
    template:"#home"
}); 
var News=Vue.extend({
    template:"#news"
}); 
var Detail=Vue.extend({
    template:"#detail"
});

//3. 準備路由
var router=new VueRouter();

//4. 關聯
router.map({
    "home":{
        component:Home,
        subRoutes:{
            "/login/:name":{
                component:{
                    template:"我是登錄信息 {{$route.params | json}}"
                }
            },
            "reg":{
                component:{
                    template:"我是注冊信息"
                }
            }
        }
    },
    "news":{
        component:News,
        subRoutes:{
            "/detail/:id":{
                component:Detail
            }
        }
    }
});

//5. 啟動路由
router.start(App,"#box");

//6. 跳轉
router.redirect({
    "/":"home"
});

GPU云服務器云服務器第六天六天第六集第六次

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/86794.html

第五第六天

摘要：上面讓我看看一些概念直接做任務感覺還是對我來說太難了，完全沒有思路，主要還是看別人代碼還好能看到別人提交的，看懂然后自己敲一遍，其實好像這樣也能有一點小收獲，總好過放棄不做吧引用一個筆記第五六天 2019.4/4 大概六個小時？不想記時間了感覺= =感覺好像對我沒啥影響今天學到了什么？盒模型浮動編碼規范嘗試了一下提交代碼到github 今天遇到了什么問題，以及情況其實是...

leanote 2019-08-02 16:10 評論0 收藏0
第五第六天

摘要：上面讓我看看一些概念直接做任務感覺還是對我來說太難了，完全沒有思路，主要還是看別人代碼還好能看到別人提交的，看懂然后自己敲一遍，其實好像這樣也能有一點小收獲，總好過放棄不做吧引用一個筆記第五六天 2019.4/4 大概六個小時？不想記時間了感覺= =感覺好像對我沒啥影響今天學到了什么？盒模型浮動編碼規范嘗試了一下提交代碼到github 今天遇到了什么問題，以及情況其實是...

darry 2019-08-30 15:43 評論0 收藏0
第六天-《企業應用架構模式》-會話狀態

摘要：無狀態的價值無狀態可以僅用很少的對象就可以處理很多的用戶，空閑狀態的用戶越多，無狀態服務器就越有用會話狀態相關性會話狀態只與當前會話有關，它存在于業務事務中，與其他會話及他們的業務事務是分開的與記錄數據信息的區別記錄數據時長期保存在數據庫中 1. 無狀態的價值：無狀態可以僅用很少的對象就可以處理很多的用戶，空閑狀態的用戶越多，無狀態服務器就越有用 2. 會話狀態：相關性：會話狀態只...

FrancisSoung 2019-07-01 11:17 評論0 收藏0
九天學會Java，第六天，變量作用域

摘要：從函數看局部變量作用域函數內定義的變量被稱為局部變量。局部變量的作用范圍從聲明開始，直到包含它的塊結束塊就是內的代碼。變量和數據類型，賦值和輸出算術運算選擇結構循環結構函數定義，函數調用變量作用域 = 3) { /* 進入代碼塊 */ int j = 10; /* j從這里到 } 都能訪問 */ System.out.println(i); /* 可以訪問...

Berwin 2019-08-15 15:33 評論0 收藏0