image - Img 源将 prop 传递给子组件 Vue Js
问题描述
所以,我正在玩 Vue Js,目前在子组件上显示图像时遇到了一些问题,所以,我看起来像这样:
父组件:
<list>
<post name="post 1" image="somePath"/>
<post name="post 2" image="somePath"/>
</list>
在我们得到的子组件上
<post>
<p> {{name}} </p>
<img src={{somePath}} />
</post>
我用 require 和其他方法尝试了几种方法......到目前为止,它们都没有奏效......有什么建议吗?另外,这是我的 img 路径的样子
"@/assets/web/mock/Phonebeats.png"
解决方案
只是想办法做到这一点!:)
基本上,在初始渲染时,在 vuejs 有机会渲染你的代码之前,浏览器会看到:
<img src="{{ url }}" />
然后浏览器尝试加载 {{ url }} 并以 404 失败。您需要使用新的 attr 语法(vue 1.0):
冗长的
<img v-bind:src="url" />
速记
<img :src="url" />
推荐阅读
- sql - 在使用 oracle 中的循环调用用户定义的函数时传递不同的日期作为参数
- bash - 如何用awk替换所有出现的符号
- swift - swift中UIBUTTON中渐变层的问题
- resampling - 应用 10 到 15 分钟值的 Pandas 重新采样
- python - Ngboost 算法可以自动处理缺失值吗?
- python - 如何在 numpy.where 条件后获取特定的数组位置?
- r - varnames 上的重复函数
- python - 为什么汤里没有表格数据标签?
- linux - 删除大量用户的 Bash 脚本未运行
- octobercms - Octobercms 在后端显示画廊的标题和图像