创建React组件，返回部分语义UI网格行

我想在使用semantic-ui时使模板的组件分解并获得编译错误。（意外的令牌（11:12））创建React组件，返回部分语义UI网格行

您可能需要一个合适的加载程序来处理此文件类型。

import React, { Component } from 'react'; 
import { Container, Label, Grid } from 'semantic-ui-react' 

export default class StatusLine extends Component { 
    constructor(props) { 
     this.state = props.fyrevm; 
    } 

    render() { 
     return (
      <Grid.Row> 
       <Grid.Column width={8}> 
        <Container textAlign='right'> 
         <Label sub>Score</Label><span>{this.state.score}</span> 
         <Label sub>Turn</Label><span>{this.state.turn}</span> 
         <Label sub>Time</Label><span>{this.state.time}</span> 
        </Container> 
       </Grid.Column> 
      </Grid.Row> 
     ); 
    } 
}

来源

2016-12-29 David Cornelson

我会对主要问题发表评论。无状态你的意思是不使用this.state，只使用道具参数？（仍然不会用super（）;）编译。 –

您确定已安装semantic-ui-react？

来源

2016-12-29 21:16:18

是的。我有一个完整的应用程序可以工作，但我试图将零件分成子组件。我希望此代码的其他用户能够使用相同的外部网格行替换此组件，但不替换内容而不破坏外部模板和网格。 –

尝试在'this.state = props.fyrevm'之前添加'super（）;'。而且你的组件应该是一个无状态的组件。 –

创建React组件，返回部分语义UI网格行

回答

相关问题