javascript - 无法读取未定义的属性 'styledComponentId'

Question

我使用 styled-component 但找不到找到匹配元素的方法。我得到了

的错误

TypeError:无法读取未定义的属性“styledComponentId”

这是我的 index.js const Container = styled.h1` 字体大小:14px；

import React from 'react'
import styled from 'styled-components'
const Container = styled.h1`
  font-size: 14px;
`

export default () => (<div>
    <Container>Hello</Container>
</div>)
export { Container }

这是我的测试(index.spec.js)

import React from 'react'
import { shallow } from 'enzyme'
import IndexPage from './index'
import { Container } from './index'
import { enzymeFind } from 'styled-components/test-utils'

describe('Pages', () => {
  describe('Index page', () => {
    it('should have a container', function() {
      const wrapper = shallow(<IndexPage />)
      expect(enzymeFind(wrapper, Container).exists()).toBe(true)
    })
  })
})

Answer 1

在您的 index.spec.js 中，您有:

import IndexPage from './index'
import { Container } from './index'

然而，您发布的代码只有 index.js 中的默认导出 - 您可能正在混合要从中导入的文件。