Question

我正在使用React测试库，但出现以下错误

错误：未捕获[TypeError：无法读取Test.tsx文件的最后一行中的属性'state'of undefined”。

如何查看所有组件是否都已渲染？按组件，我的意思是：根据我的Abc.tsx文件的全名，标题，日期和其他？可以呈现ShowPage的所有组件的参数应该是什么？因为如果我只在渲染中渲染<Abc/>，它将给我错误：

没有重载匹配此调用。重载1，共2个，'（props：Readonly）：ShowPage'，出现以下错误。类型“ {}”中缺少属性“发布”，但类型为“只读”时则为必需。重载2之2，'（props：ShowProps， context ?: any）：ShowPage'，则出现以下错误。类型“ {}”中缺少属性“发布”，但类型为“只读”时则必需。

Test.tsx



export default class Abc extends React.Component < ShowProps > {
  render() {
    ;

    return (
      <div className="Post-description">
          <Title>{post.title}</Title>
          <hr/>
          <Name>
          {`${post.fullName}|${dateToString(currentDateTime)}`}
          </Name>
          <br/>
          <Question>{post.body}</Question>
          <hr/>
          <AllComments/>
      </div>
    ) 
  }
}

Answer 1

Gotcha。 this.state在测试中应未定义，因为测试用例不是react的常规组成部分。此外，您应该在测试时嘲笑您的帖子，并将其作为道具传递给ShowPage组件。那你就很好了。而且，只要您不使用路由器的API（即历史对象），我就不需要路由器和路由作为包装器。

const post = {
  fullName: 'Muhammad Ali',
  title: 'Post title',
  body: 'Post body',
  updatedAt: '1/30/2020',
}
const {getByPlaceholderText, queryByTestId} = render(
   <ShowPage post={post}/>
);

错误：未捕获[TypeError：无法读取未定义的属性'state'

1 个答案: