响应本机不变：未找到名称为img的视图配置

Question

当我运行react-native run-android时，我看到一个Invariant Violation，它告诉我“查看未找到的配置或名称导航”。然后所有发生此违规行为的站点。帮助，请谢谢。

import React from "react";
import PropTypes from "prop-types";
import { Card } from "shards-react";
class User extends React.Component {
  render() {
     const { name, avatar, email, isLoading } = this.props;
     const userDetails = (
      <div>
        <img
          className="img-thumbnail rounded-circle mx-auto mb-2 shadow-sm"
          src={avatar}
          alt={name}
          style={{ width: "100px", height: "100px" }}
         />
        <h4 className="mb-0">{name}</h4>
        <span className="text-muted">{email}</span>
      </div>
    );
    const loadingMessage = <span className="d-flex m-auto">Loading... 
 </span>;
    return (
      <Card
        className="mx-auto mt-4 text-center p-5"
        style={{ maxWidth: "300px", minHeight: "250px" }}
      >
        {isLoading ? loadingMessage : userDetails}
      </Card>
    );
  }
}
User.propTypes = {
  name: PropTypes.string,
  avatar: PropTypes.string,
  email: PropTypes.string,
  isLoading: PropTypes.bool
};
export default User;

Answer 1

您不能在React Native应用程序中使用DOM元素（div，img，h4，span等）。 React Native使用Native iOS或Android元素进行通信。 在此处查看文档：{​​{3}}