ReactJS не рендерится на Laravel - PullRequest
Новая
       0

ReactJS не рендерится на Laravel

0 голосов
/ 19 сентября 2019

Я пытаюсь сделать реагировать на компонент в моем браузере (5.7), но он, похоже, не обнаруживается.Вот как выглядят мои файлы:

welcome.blade.php 

<!DOCTYPE html>
<html lang="{{ app()->getLocale() }}">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="csrf-token" content="{{ csrf_token() }}" />
    <title>React JS</title>

    <!-- Fonts -->
    <link href="https://fonts.googleapis.com/css?family=Varela+Round" rel="stylesheet" type="text/css">

    <!-- Styles -->
    <link href="{{asset('css/app.css')}}" rel="stylesheet">

</head>
<body>
    <div id="root"></div>
    <script src="{{asset('js/app.js')}}"></script>
</body>
</html>

Example.js 

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import App from "./App.js";
ReactDOM.render(<App />, document.getElementById("root"));

App.js 

import React from 'react';

class App extends React.Component() {
    render(){
        return (
            <div>
                <h1>Hello</h1>
                <p>What a REAVELation</p>
            </div>
        );
    }

}
export default App;

npm run watch работает и не показывает ошибок.

Пожалуйста, что я могу здесь делать не так?

1 Ответ

0 голосов
/ 19 сентября 2019

У вас есть синтаксическая ошибка при объявлении класса в App.js.Вы не используете скобки, когда объявляете класс в JavaScript.

class App extends React.Component {
    render(){
        return (
          <div>
            <h1>Hello</h1>
            <p>What a REAVELation</p>
          </div>
        );
    }
}

ReactDOM.render(<App />, document.getElementById("root"));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="root"></div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...