Реагирующее приложение перенаправлено на неопределенный маршрут - PullRequest
Новая
       30

Реагирующее приложение перенаправлено на неопределенный маршрут

0 голосов
/ 08 сентября 2018

Я новичок в разработке Front-end и пытаюсь выучить ReactJS. В одном из моих примеров приложений я использую команду «live-server public» для запуска приложения на моем локальном хосте в целях разработки.

package.json содержимое 

{
  "name": "indecision-app",
  "version": "1.0.0",
  "main": "index.js",
  "author": "Phani Kumar",
  "license": "MIT",
  "dependencies": {
    "babel-preset-env": "1.5.2",
    "babel-preset-react": "6.24.1"
  }
}

Мое приложение компилируется с использованием babel и запускается автоматически с помощью live-сервера. 

"use strict";
var app = {
    title: 'Indecision App',
    subtitle: 'put your life in the hands of a computer',
    options: ['one','two']
};

function showOptions(){
    if (app.options.length > 0){
        return <p>Here are your options</p>
    }else {
        return <p>No Options</p>
    }
}

var template = (
    <div>
        <h1>{app.title}</h1>
        {app.subtitle && <p>{app.subtitle}</p>}
        {showOptions()}
        <ol>
            <li>Item one</li>
            <li>Item two</li>
        </ol>
    </div>
);

var user = {
    name: 'phani',
    age: 30,
    location: 'Bangalore'
};
var userName = 'PhaniKumar Yadavilli';
var age = 30;
var location = "Bangalore";

function getLocation(location){
    if (location){
        return <p>Location: {location}</p>;
    }else {
    return undefined;
    }
}

var templateTwo = (
    <div>
        <h1>{user.name ? user.name : 'Anonymous'}</h1>
        {(user.age && user.age >= 18) && <p>Age: {user.age}</p>}
        {getLocation(user.location)}
    </div>
);
var appRoot = document.getElementById('app');


ReactDOM.render(templateTwo, appRoot);

В тот момент, когда я нажимаю на URL 127.0.0.1: 8080 , приложение перенаправляется на 127.0.0.1: 8080 / Бангалор . Я попытался отладить, но я не мог понять, в чем причина этого перенаправления.

index.html content 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf8">
        <title>Indecision App</title>
    </head>
    <body>
        <div id="app"></div>
        <script src="https://unpkg.com/react@16.0.0/umd/react.development.js"></script>
        <script src="https://unpkg.com/react-dom@16.0.0/umd/react-dom.development.js"></script>
        <script src="/scripts/app.js"></script>
    </body>
</html>

1 Ответ

0 голосов
/ 08 сентября 2018

Оператор var location = 'Bangalore'; инициирует перенаправление, так как location - это зарезервированное слово в JavaScript, которое представляет URL-адрес браузера. Переименуйте переменную во что-то другое

Редактировать: для правильного перенаправления нужно сделать так: window.location = 'somewhere to go to'.

var location = '' - это больше "ошибка"

...