vue img标签图片显示不出来,vue 引入图片
本文主要介绍了某视频剪辑软件页面中引入图片图片的方法,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
我们在学习超文本标记语言的时候,图片标签图片引入图片
img src=./资产/图像/头像。png 宽度= 100%
但是这样会有2个弊端:
因为采用绝对路径引入,所以如果后面这张图片移动了目录,就需要修改代科学研究委员会里的路径
如果这张图片在同一页面内有多个地方要使用到,就需要引入多次,而且图片移动了目录,这么多地方都要修改科学研究委员会路径
怎么办?使用动态路径import、require
首先讲讲这两个兄弟,在ES6之前,JS一直没有自己的模块语法,为了解决这种尴尬就有了require.js,在ES6发布之后射流研究…又引入了进口的概念
使用import引入
进口之后需要在数据中注册一下,否则显示不了
脚本
从" @/assets/images/city of vitality/lf1。巴布亚新几内亚"导入lf1
从" @/assets/images/city of vitality/lf2。巴布亚新几内亚"导入lf2
从“@/资产/图片/活力之城/lf3。巴布亚新几内亚"导入lf3
从“@/资产/图片/活力之城/lf4。巴布亚新几内亚"导入lf4
从" @/assets/images/city of vitality/lf5。巴布亚新几内亚"导入lf5
从" @/assets/images/city of vitality/LF6。巴布亚新几内亚"导入LF6
从“@/资产/图片/活力之城/lf7。巴布亚新几内亚"导入lf7
从" @/assets/images/city of vitality/icon _ top 1。巴布亚新几内亚"导入前1名
从导入混合。/混合
导出默认值{
名称:左片,
mixins: [mixins],
data () {
返回{
lf1,
lf2,
lf3,
lf4,
lf5,
lf6,
lf7,
top1
}
}
}
/脚本
使用require引入
脚本
从" @/assets/images/city of vitality/icon _ top 1。巴布亚新几内亚"导入前1名
从导入混合。/混合
导出默认值{
姓名: RightPiecr ,
mixins: [mixins],
data () {
返回{
rt1:require( @/assets/images/活力之城/rt1。png’),
rt2:require( @/assets/images/活力之城/rt2。png’),
rt3:require( @/assets/images/活力之城/rt3。png’),
rt4:require( @/资产/图片/活力之城/rt4。png’),
rt5:require( @/assets/images/活力之城/rt5。png’),
rt6:require( @/assets/images/活力之城/rt6。png’),
top1
}
}
}
/脚本
到此这篇关于某视频剪辑软件页面中引入图片图片的方法的文章就介绍到这了,更多相关某视频剪辑软件引入图片图片内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!
郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。