1.7 KiB
Layout
Add a new layout
Take a new layout named secondary as an example to make the route starting with seconday use this layout.
- Add related configuration in
src/utils/config.js. For details, please refer to layouts.
javascript layouts: [ { name: 'primary', include: [/.*/], exlude: [/(\/(en|zh))*\/login/, /(\/(en|zh))*\/seconday\/(.*)/], }, { name: 'secondary', include: [/(\/(en|zh))*\/seconday\/(.*)/], }, ],
- Add the
secondarylayout component to thesrc/layouts/BaseLayout.jsfile.
```javascript import SecondaryLayout from './SecondaryLayout'
const LayoutMap = { Primary: PrimaryLayout, Public: PublicLayout, Secondary: SecondaryLayout, } ```
- Add the
SecondaryLayout.jsfile to thesrc/layouts/directory.
```javascript import React from 'react'
export default ({ children }) => { Return (
Seconday
{children}- Add a
seconday/index.jsfile to thesrc/pages/directory.
```javascript import React from 'react'
export default ({ children }) => { Return
- Finally, start the development mode
npm run start, open http://localhost:7000/seconday/ and you will see the page for thesecondaylayout.