Ich gehe axios.get 从 database 获取反应式 image 链接 wie unten gezeigt vorbei:
<div class="main-image" :style="{'background-image': 'url(' + state.articles.image[0] + ')'}">
Alles funktioniert einwandfrei, das Hintergrundbild des Div wurde korrekt geändert. Das einzige Problem ist, dass meine Konsole Folgendes auslöst:
GET http://localhost:3000/undefined 404 (Not Found)
Offensichtlich zeigt das url 没有指向任何地方，但是当 background-image 正确显示时，这怎么可能呢？在我的 CSS 中，我没有设置 background-image 属性，只有 background: no-repeat center 但即使我删除这些错误仍然存在。有什么想法如何摆脱 404?
Nach dem Hinzufügen von template 发送到 template 之前运行 console.log(state.articles.image[0]) wird der richtige Bildlink generiert:
storage/brrAlEXfmEvoqjXiRhgalgzT9f2MfbX07Q4wDL0i.jpg
Selbst wenn ich den Link in der Vorlage ausgebe (z. B. in einem h-Tag), wird der korrekte Link angezeigt. Wo liegt also das Problem?
模板将在
state.articles.image[0]已知之前呈现。 div 标签被渲染，浏览器将尝试获取尚未定义的undefined背景图片 url。解决此问题的一种方法是仅在状态就绪时渲染<div>。