2

我已经尝试使用我的 Meteor + React 项目实现AdminLTE控制面板引导模板(AdminLTE),并且使用下面的代码,一切都运行良好(除了一件事 - 见下文)MasterPage

import React from 'react'

import { Header } from './masterpage/Header'
import { MainSideBar } from './masterpage/MainSideBar'
import { ControlSideBar } from './masterpage/ControlSideBar'
import { Footer } from './masterpage/Footer'

export const MasterPage = ({content}) =>
    <div className="hold-transition skin-green sidebar-mini">
        <div className="wrapper">
            <Header />
            <MainSideBar />
            {content}
            <Footer />
            <ControlSideBar />
            <div className="control-sidebar-bg"></div>
        </div>
    </div>

这是我的路由发生的情况:

import { FlowRouter } from 'meteor/kadira:flow-router'
import React from 'react'
import { mount } from 'react-mounter'

//Layouts and Pages
import { MasterPage } from '../../ui/layouts/MasterPage'
import { HomePage } from '../../ui/pages/HomePage'

FlowRouter.route('/', {
    name: 'homepage',
    action() {
        mount(MasterPage, {
            content: <HomePage />
        })
    }
})

实施此操作后,一切都很好,除了单击切换按钮时没有打开控制侧边栏:

<li>
    <a href="#" data-toggle="control-sidebar">
        <i className="fa fa-gears"></i>
    </a>
</li>

我试过通过 CSS 打开它,这似乎工作正常。我遇到的另一个问题是现在它不会拉伸窗口的整个宽度。底部有大量的空白区域刚刚没有使用,而且看起来不太好。

所有这些问题都是从我实施的那一刻开始的FlowRouter(在那之前效果很好)。我执行FlowRouter不正确吗?如果是这样,我该怎么办?

任何帮助将非常感激!

4

0 回答 0