React еще не отрисован - PullRequest
Новая
       30

React еще не отрисован

0 голосов
/ 11 июля 2020

Я новичок в этой области. Прошу помощи. Предполагалось загрузить картинки; однако вместо этого говорится, что я еще не отрисовал. Кто-нибудь может мне помочь? Или порекомендовать сайт, когда я смогу узнать о нем больше?

Заранее спасибо. 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <!--REACT LIBRARY-->
    <script src="https://unpkg.com/react@15.5.4/dist/react.js"></script>
    <!--REACT DOM LIBRARY-->
    <script src="https://unpkg.com/react-dom@15.5.4/dist/react-dom.js"></script>
    <!--BABEL LIBRARY-->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.25.0/babel.min.js"></script>
     
    <title>FriendLy</title>
</head>
<body>
    <div id="app">React has not rendered yet</div>

    <script type="text/babel">

    //FriendLy Complex Component
    function FriendLy(){
        return( 
            <div>
                <Avatar/>
                <UserName/>
                <GetConnected/>
            </div>
        );
    }

    //Avatar Component
    function Avatar(){
        return (
            <img src="https://scontent.ftpf1-1.fna.fbcdn.net/v/t1.0-9/87995869_3235932739767864_4174493673800597504_n.jpg?_nc_cat=107&_nc_sid=09cbfe&_nc_ohc=BOdWu5KFnBwAX9X9FDz&_nc_ht=scontent.ftpf1-1.fna&oh=44631cd3c84d98db17c14bc9ea213f73&oe=5F1B1D6A" alt="profile pic"/>
        );
    }

    ReactDom.render(
        <FriendLy/>,
        document.getElementById("app")
    );
    
    
    
    </script>
    
</body>
</html>

1 Ответ

2 голосов
/ 11 июля 2020

Таким образом, это немного необычно. На самом деле я не знал, что вы можете использовать такую ​​реакцию без инструментов сборки, но это довольно круто.

Просто здесь синтаксическая ошибка. Вам необходимо обновить это: 

ReactDom.render(...) to ReactDOM.render(...)

Таким образом, Dom должен быть в DOM заглавными буквами

Кроме того, если вы визуализируете свой компонент, он не будет работать, поскольку он не полностью определен. Вы можете проверить это, просто отрендерив компонент Avatar.

Надеюсь, что это поможет!

...