首页 > 解决方案 > 我的组件没有渲染,为什么?

问题描述

我对 React 很陌生,经过长时间的尝试后,我无法在主应用程序 js 中添加组件

我用 create-react-app 创建了我的样板

在主 app.js 我有:

import React, {Component} from 'react';
// import logo from './logo.svg';
import casa_mini from './casa_mini'; 
import './App.css';



class App extends Component {
    render() {
        return (<casa_mini></casa_mini>    );
    }
}

export default App;

在 casa_mini.js 我有:

 import React, {Component} from 'react';

class casa_mini extends Component {
    render() {
        return (

            <div className="listing-box">
                <div className="listing-box-image" style={{backgroundImage: 'url("assets/img/casa1.jpg")'}}>
                </div>
            </div>

        );
    }
}

export default casa_mini;

为什么它不渲染任何东西?casa_mini 的 HTML 没有出现.. 空白页.. 感谢您的帮助!


标签: reactjsjsx

解决方案


感谢您提供一些快速的答案..问题是组件的大写字母..

index.js: Warning: The tag <casa_mini> is unrecognized in this browser. If you meant to render a React component, start its name with an uppercase letter.

应该大写!


推荐阅读