Rails Active Storage - Недопустимое свойство фонового изображения? - PullRequest
Новая
       8

Rails Active Storage - Недопустимое свойство фонового изображения?

0 голосов
/ 19 февраля 2019

Так что в моем приложении у меня есть карта, на которой я хочу динамически установить фоновое изображение через ActiveStorage, например: 

  <div class="card" style="background-image: url(<%= rails_blob_path(post.images.first) %>)">

 </div>

, однако изображение не видно.Внутри Chrome я также получаю свойство element.style "invalid type property" как ошибку.

Если я проверяю элемент карты, URL-адрес загружается следующим образом: 

`background-image: url(/rails/active_storage/blobs/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBCdz09IiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--9be6ec89650623cc4a22214c34635f2924f8feea/Frame%20(1).png)`

Принимая URL-адрес и добавляя к нему localhost: 3000, загружается изображение: 

localhost:3000/rails/active_storage/blobs/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBCdz09IiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--9be6ec89650623cc4a22214c34635f2924f8feea/Frame%20(1).png

Обычная отрисовка изображения внутри тега img работает нормально: 

<%= image_tag(post.images.first) %>

Кроме того, изменение rails_blob_path на rails_blob_url вообще не имеет значения.Единственное изменение заключается в том, что в rails_blob_url добавлен localhost: 3000: 

http://localhost:3000/rails/active_storage/blobs/eyJfcmFpbHMiOnsibWVzc2FnZSI6IkJBaHBCdz09IiwiZXhwIjpudWxsLCJwdXIiOiJibG9iX2lkIn19--9be6ec89650623cc4a22214c34635f2924f8feea/Frame%20(1).png

Добавление высоты / ширины к классу карт также не приводит к разнице.

Вот ссылка, которую я нашел, похоже, что они используют тот же подход, что и я: Ruby on rails 5.2 - фоновое изображение с активным хранилищем

Anyидеи где проблема может быть?

Спасибо всем заранее!

Привет!

1 Ответ

0 голосов
/ 19 февраля 2019

Спасибо всем за ваш вклад!

Я смог это исправить.На всякий случай, если кто-то столкнется с той же проблемой:

Добавьте одинарные кавычки к вашему пути:

Решение: 

 <div class="card" style="background-image: url('<%= rails_blob_url(post.images.first) %>'); height: 100px; background-position: center;">

Для сравнения (до): 

 <div class="card" style="background-image: url(<%= rails_blob_path(post.images.first) %>)">

Двойные кавычки не работают в этом примере.

Возможно, это даже не проблема, если бы я просто использовал файл scss вместо того, чтобы добавлять его непосредственно в div.

Ура!

...