我們做應用時經常需要做底部或者頂部導航切換變換頁面功能,類似android的導航+fragment
1、創業乙個**介面首頁
先加入路由 import react from 'react';
import headercomponent from '../common/header'
import from 'react-router-dom';
import goodsdetail from './details';
import goodscomment from './comment';
export default class goodsindex extends react.component 詳情)
}//切換子頁面
gosubpage(path)
}
建立乙個公共頭部
import react from 'react';
//子元件返回要用這個方法
import from 'react-router';
class headercomponent extends react.component
goback()
}//子元件返回時直接 this.props.history.goback();用不了,必須用withrouter
export default withrouter(headercomponent);
3、兩個子頁面
import react from 'react';
export default class goodsdetails extends react.component
}import react from 'react';
export default class goodscomment extends react.component
}
Angular路由 子路由
在商品詳情頁面,除了顯示商品id資訊,還顯示了商品描述,和銷售員的資訊。通過子路由實現商品描述元件和銷售員資訊元件展示在商品詳情元件內部。ng g component productdesc ng g component sellerinfo 重點是修改銷售員資訊元件,顯示銷售員id。import ...
vue router子路由 路由巢狀
定義 子路由,也叫路由巢狀,採用在children後跟路由陣列來實現,陣列裡和其他配置路由基本相同,需要配置path和component,然後在相應部分新增來展現子頁面資訊,相當於嵌入iframe。hello h1 新增子路由導航 導航 home 首頁 router link home one 子頁...
子路由模組
1ng generate module hero 123 4567 891011import from angular core import from angular common ngmodule export class heromodule 123 4567 8import from ang...