Question

我使用样式组件，但是找不到找到匹配元素的方法。我遇到

错误

TypeError: Cannot read property 'styledComponentId' of undefined

这是我的index.js const Container = styled.h1` 字体大小：14像素；

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中具有默认导出功能-您可能正在混入要从中导入的文件。

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

1 个答案: