小编Men*_*ith的帖子

React.js未捕获错误:不变违规

由于缺乏对Commonjs模块的支持,来自react_rails gem的令人沮丧之后,我正在测试netguru的react_webpack_rails gem.但从那时起我就遭到了不变的违规行为.

例如,如果我在ES6语法中编写一个简单的Hello World组件:

import React from 'react';

class tasksBox extends React.Component {
  render() {
    return <div>Hello World</div>;
  }
}

export default tasksBox;
Run Code Online (Sandbox Code Playgroud)

提出这些错误:

Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components).

Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.
Run Code Online (Sandbox Code Playgroud)

你的帮助将不胜感激,我无法弄清楚错误的来源.

reactjs webpack

9
推荐指数
2
解决办法
3万
查看次数

如何防止弹性项目的高度因其内容而溢出

我刚开始学习flex,到目前为止,我印象深刻。但是,我遇到了包含页眉/页脚和三列的整页应用程序的问题。第一列包含一个项目列表,由于我无法为其父项设置固定高度,因此每当列表增加时,它都会将页脚向下推。

这是具有布局的codepen:http : //codepen.io/anon/pen/vNVQNj Html:

<html>
<head>
  <body>
    <div class="app-wraper">
      <div class="Navbar"></div>
      <div class="main-content">
        <div class="Bidlist">
          <div class="column">
            <div class="tabcontainer">
            </div>
          <div class="content-container">
          <ul class="list-group instruments">
            <li class="intrument"></li>
            <li class="intrument"></li>
            <li class="intrument"></li>
            <li class="intrument"></li>
            <li class="intrument"></li>
            <li class="intrument"></li>
            <li class="intrument"></li>
            <li class="intrument"></li>
            <li class="intrument"></li>
            <li class="intrument"></li>
            <li class="intrument"></li>
            <li class="intrument"></li>
            <li class="intrument"></li>
            <li class="intrument"></li>
            <li class="intrument"></li>
            </ul>
            </div>
          </div>
        </div>
      </div>
      <div class="footer"></div>
    </div>
  </body>
</head>
</html>
Run Code Online (Sandbox Code Playgroud)

CSS:

html,
body {
  background-color: #212121;
  overflow: hidden;
}
/* layout */ …
Run Code Online (Sandbox Code Playgroud)

css css3 flexbox

2
推荐指数
1
解决办法
3279
查看次数

标签 统计

css ×1

css3 ×1

flexbox ×1

reactjs ×1

webpack ×1