Изображение боковой панели исчезает при перезагрузке страницы Laravel

#php #laravel #vue.js #eloquent

#php #laravel #vue.js #красноречивый

Вопрос:

Я использую vue-router для навигации между меню и выполнения некоторых запросов с помощью axios. Всякий раз, когда страница перезагружается, изображение на боковой панели исчезает. Я не уверен, что является причиной этого. Заранее спасибо.

ПЕРЕД

ПОСЛЕ перезагрузки

 <aside class="main-sidebar elevation-4" style="background-color:#F4F6F9"> 
<a href="#" class="brand-link">
  <img src="./img/logo.png"  class="brand-image img-thumbnail elevation-3">
  <img src="./img/uthm.png"  class="brand-image img-thumbnail elevation-3">
       <br>
</a> 
</aside>

Ответ №1:

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

например.

 http://www.example.com/page1

# Works fine so far
../path/to/image.jpg

при перезагрузке:

 http://www.example.com/page1/page2

# Your image link now needs to revert back one level
../../path/to/image.jpg

У меня была похожая проблема, когда моя индексная страница работала нормально, но как только я зашел в каталог, он взбесился, я понял, что мне нужен лучший способ назначить img src

Обновление Мое исправление заключалось в использовании встроенной команды в laravel, которая указывала корневой путь к файлу. Возможно, вам придется выяснить, имеет ли Vue аналогичную функцию для направления всегда в корневую папку, где бы вы ни находились.

Быстрое решение — указать полный путь к каталогу

 # instead of the relative path
../path/to/image.com

# Try
http://example.com/root/path/to/image.jpg

# or if offline

http://127.0.0.1/root/path/to/image.jpg

1. да, это правда, я только что это понял! есть способы преодолеть это?

2. Я работал над проектом laravel, который, я думаю, был PHP. У Vue может быть специальная функция для вызова, которая указывает маршрут к корню вашего проекта, я обновлю свой ответ

Ответ №2:

Не могли бы вы предоставить нам более подробную информацию. Я буду участвовать в этом со своим предложением, если вы используете vue-router и при перезагрузке страницы изменилась ли ссылка, я точно знаю, что это ваша проблема, например, когда вы перезагружаете этот URL (https://127.0.0.1/test /) , это будет (https://127.0.0.1/test /#/) тотпуть, по которому вы загружаете свои изображения, изменится, поэтому вам нужно настроить app.js в этом пути (ресурсы активы js) , и вам нужно добавить эту строку в свой маршрут.

 const router = new VueRouter({
    mode:'history',
  routes 

})

если вы это сделаете, URL-адрес будет some после перезагрузки страницы.