在Rails应用程序中渲染Navbar React组件

时间:2017-07-22 20:56:39

标签: ruby-on-rails twitter-bootstrap reactjs react-rails

我有一个安装了react-rails gem的简单Rails 5应用程序。我想创建一个Navbar,它将出现在我应用中每个页面的顶部。我是React的新手,所以通常我要做的是在application.html.erb中包含一个erb标签,它会渲染一个名为_navbar.html.erb的布局助手,并且会出现在yield块之上。如何使用react-rails gem和navbar组件完成同样的事情?像这样从application.html.erb渲染react组件似乎不起作用:

<body>
  <div id='app'>
    <%= react_component 'Navbar' %>
    <%= yield %>
  </div>
</body>

也许它与<%= javascript_include_tag 'application' %>中的<head>有关,而{2004}内的//make attribute argument BOOST_LOG_ATTRIBUTE_KEYWORD(a_channel, "Channel", std::string)//???????????? void init_file_collecting(boost::shared_ptr< file_sink > sink) { sink->locked_backend()->set_file_collector(sinks::file::make_collector( keywords::target = "logs", /*< the target directory >*/ keywords::max_size = 16 * 1024 * 1024, /*< maximum total size of the stored files, in bytes >*/ keywords::min_free_space = 100 * 1024 * 1024, /*< minimum free space on the drive, in bytes >*/ keywords::max_files = 7 /*< maximum number of stored files >*/ )); } boost::shared_ptr< logging::core > core = logging::core::get(); /* src::channel_logger<std::string> lg_chan_0(keywords::channel = "0"); src::channel_logger<std::string> lg_chan_1(keywords::channel = "1"); src::channel_logger<std::string> lg_chan_2(keywords::channel = "2"); src::channel_logger<std::string> lg_chan_3(keywords::channel = "3"); src::channel_logger<std::string> lg_chan_4(keywords::channel = "4"); src::channel_logger<std::string> lg_chan_5(keywords::channel = "5"); src::channel_logger<std::string> lg_chan_6(keywords::channel = "6"); */ core->add_global_attribute("ThreadID", boost::log::attributes::current_thread_id()); core->add_global_attribute("TimeStamp",attrs::local_clock()); core->add_global_attribute("RecordID", attrs::counter< unsigned int >(1)); logging::add_common_attributes(); //lg_chan_0(keywords::channel = "net"); // Create a text file sink boost::shared_ptr< file_sink > sink0(new file_sink( keywords::file_name = "first_date_with_404.log", keywords::rotation_size = 16384 )); sink0->set_filter(expr::attr< std::string >("Channel") == "0"); init_file_collecting(sink0); sink0->set_formatter ( expr::format("record id=\"%1%\" [\"%2%\"] thread_id= %3% %4%") % expr::attr< unsigned int >("RecordID") % expr::attr< boost::posix_time::ptime >("TimeStamp") % expr::attr< attrs::current_thread_id::value_type >("ThreadID") % expr::message ); core->add_sink(sink0); 内部尚未完全呈现。任何帮助将不胜感激(包括react-bootstrap导航栏组件的奖励积分!)谢谢!

编辑:我现在可以显示某些内容,但它的格式不像导航栏。我使用的是react-bootstrap文档示例,但还没有运气。

screenshot

0 个答案:

没有答案