Question

import styled from 'react-emotion'

class Field extends React.Component<> {}

export default styled(Field)

然后，如果我渲染此组件并使用component.type，我会获得styled()...函数而不是Field组件。

如何在样式函数中获得Field？

Answer 1

试试这个：

import styled from 'react-emotion'

const Field = ({ className }) => (
    <div className={className}>Some field</div>
)

const theField = styled(Field)`
    color: green;
`
export default theField

Answer 2

导出函数只是导出函数，但我认为你想要组件。那为什么不呢？

import styled from 'react-emotion'

class Field extends React.Component<> {}

const styledField = styled(Field)

export default styledField

Answer 3

styled库没有提供任何获取字段的方法。即使它Field.type undefined也是class Field extends React.Component<> { render() { return (<div></div>); } } console.log(Field.type); // this will be 'undefined' not 'div' as you might expect，因为Field没有此属性。您可以尝试使用此代码并查看：

$unwind

将组件放入react-emotion或styled-component中

3 个答案: