программа разработки панели навигации reactjs (с использованием bootstrap css внутри)

#css #reactjs #navbar

#css #reactjs #панель навигации

Вопрос:

У меня проблема с панелью навигации,

У меня есть панель навигации для моего проекта. Как вы можете видеть мой код ниже, если я использую ссылку и получаю ее из внешнего источника, она работает хорошо. Но у меня есть проблема, когда сеть немного медленная, я вижу, как навигация загружается на моем экране. это очень небольшая продолжительность, но меня это очень беспокоит. Поэтому я решил использовать исходный код CSS из папки моего проекта, но не смог этого сделать. Я перепробовал много примеров кода, но не смог сделать это правильно. Если кто-нибудь мне поможет, я буду признателен. Спасибо. Я также все еще пытаюсь решить эту проблему, но я хотел бы получить некоторую помощь.

 function MyNavBar(params) {
  //console.log(params["conpanyID"]);
  return (
    <div>
      <head>
        <link
          rel="stylesheet"
          href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
        />
      </head>
  

1-Когда я использую ссылку / внешний источник
[1]:https://i.stack.imgur.com/SO5qB.png
2-Когда я использую файл CSS из папки моего проекта.
[2]:https://i.stack.imgur.com/MqHqo.png

Ответ №1:

возможно, вы связали свою таблицу стилей внутри тела вместо раздела заголовка, из-за чего ваша страница загрузится первой, а затем ваш CSS

вот пример

 <!DOCTYPE html>
<html lang="en" dir="ltr">

<head>
  <meta charset="utf-8">
  <title>file</title>
  <link rel="stylesheet" href="css/s.css">
  <link rel="icon" href="css/si.ico">
</head>
  

Комментарии:

1. Нет, я использовал это в разделе заголовка. Но вы дали идею, и когда я попробовал ее, я нашел решение. Когда я использую локальный файл css, в файле css была ошибка, поэтому приложение выдало мне ошибку, теперь я добавил ее и удалил файл css, который искал файл шрифта на том же сервере. Итак, теперь это сработало. Спасибо за вашу помощь.

2. И теперь мой код, как показано ниже. Я удалил раздел заголовка. Сейчас я не вижу навигацию по загрузке. импортировать стиль из «./css/bootstrap.min.css»; импортировать «bootstrap/js/src/collapse.js «; функция MyNavBar (параметры) { //console.log(параметры[«conpanyID»]); return ( <div> <класс навигации=»панель навигации по умолчанию»> <класс div=»контейнер-жидкость»> <класс div=»панель навигации-заголовок»>

3. Интересно, что. Когда я пишу свою проблему здесь, я могу легко ее решить. Но когда я борюсь за себя, это занимает все больше и больше времени. Это действительно хорошо. Благодаря stackoverflow. заставляет меня быстрее решать свои проблемы.