Skip to content

[vue] 怎么解决vue动态设置img的src不生效的问题? #553

Open
@haizhilin2013

Description

@haizhilin2013
Collaborator

[vue] 怎么解决vue动态设置img的src不生效的问题?

Activity

chenqim

chenqim commented on Jul 3, 2019

@chenqim

<img :src="require('../../../assets/images/xxx.png')" />

llccing

llccing commented on Jul 4, 2019

@llccing

这里还可以产生一个问题,为什么Vue中给img标签设置src属性会不生效

Wu-wb

Wu-wb commented on Jul 12, 2019

@Wu-wb

因为动态添加src被当做静态资源处理了,没有进行编译,所以要加上require。

Miboweixin

Miboweixin commented on Aug 6, 2019

@Miboweixin

<img :src="require('../../../assets/images/xxx.png')" />

不是应该 require('@/assets/images/xxx.png') 这样吗??你这样多浪费资源啊 @chenqim

iugu516

iugu516 commented on Sep 3, 2019

@iugu516

require('@/assets/images/xxx.png')

chenqim

chenqim commented on Sep 3, 2019

@chenqim

<img :src="require('../../../assets/images/xxx.png')" />

不是应该 require('@/assets/images/xxx.png') 这样吗??你这样多浪费资源啊 @chenqim

学到了

Linkontoask

Linkontoask commented on Sep 23, 2019

@Linkontoask

这个 issues 不明确,这个应该属于打包工具范畴,和 Vue 没多大关系。可以用一个很简单的例子证明,直接用 script 的形式引入vue,然后更改src的值看能不能访问,麻烦你们弄清楚其中的原理再来解决问题

wush12

wush12 commented on Nov 5, 2019

@wush12

这个应该和vue没关系把,图片,需要改变的时候,就切换src啊

mingyec

mingyec commented on Mar 28, 2020

@mingyec

@chenqim 实际中并不需要这样,直接在src里面写@/assets/xxx.png即可(前提是你的项目通过vue-cli生成或配置了file-loader)

FL-Yf

FL-Yf commented on May 27, 2020

@FL-Yf

用require()引入

aatoe

aatoe commented on Aug 18, 2020

@aatoe

这个 issues 不明确,这个应该属于打包工具范畴,和 Vue 没多大关系。可以用一个很简单的例子证明,直接用 script 的形式引入vue,然后更改src的值看能不能访问,麻烦你们弄清楚其中的原理再来解决问题

为什么不把自己的思路说出来呢?不应该是提出问题,解决问题吗?

crush2020

crush2020 commented on Jan 28, 2021

@crush2020

因为动态添加src被当做静态资源处理了,没有进行编译,所以要加上require。
<img class="logo" :src="require("./../assets/images/logo.png")" alt="公司logo">

xl495

xl495 commented on Jun 22, 2021

@xl495

这个问题应该是指 vue 这种情况吧

<img :src="name" />

data(){
return {
name: ''
}
}

用 this.$set

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @haizhilin2013@llccing@mingyec@Linkontoask@chenqim

        Issue actions

          [vue] 怎么解决vue动态设置img的src不生效的问题? · Issue #553 · haizlin/fe-interview