vue.js怎么引入img


本文摘自PHP中文网,作者coldplay.xixi,侵删。

vue.js引入img的方法:1、图片通过后端返回引入网络图片路径;2、通过require引入图片,代码为【imgUrl: {src: require('../assets/images/index/banner.png')}】。

【相关文章推荐:vue.js】

vue.js引入img的方法:

解决一

图片通过后端返回引入网络图片路径即可。

1

2

3

<div class="banner-item"

  :style="{'background': `url(${$base.urlImage}${item.shufflingUrl})`,'background-size':'cover'}"

     ></div>

解决二

通过require引入图片

1

2

3

4

5

6

7

8

9

10

11

<script>

    export default {

        data() {

            return {

                imgUrl: {

                    src: require('../assets/images/index/banner.png'),

                }

            }

        }

    }

</script>

1

2

3

4

5

6

7

8

9

10

11

12

<script>

    require oBanner from '../assets/images/index/banner.png'

    export default {

        data() {

            return {

                imgUrl: {

                    src: oBanner,

                }

            }

        }

    }

</script>

以上就为两种图片引入不显示的问题。希望对大家有帮助。

相关免费学习推荐:javascript(视频)

以上就是vue.js怎么引入img的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

20+道必知必会的vue面试题(附答案解析)

vue项目中引入bootstrap的方法

如何做到刷新vue.js改变数据

vue.js能用正则表达式吗

vue.js怎么实现移动端适配

使用vue.js需要注意什么

vue.js插件是什么意思

vue.js怎么样显示时间

4个很 nice 的vue router过渡动效,快来收藏!

vue.js 学习记录之一:学习规划和了解 vue.js

更多相关阅读请进入《vue.js》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...