Vue 怎么动态改变 image 内容

2021-05-03 22:58:17 +08:00
 line
<img :src="b64img1"/>

data () {
    return {
     b64img1: '',
     b64img2: ''
    }
 }

这里 b64img1 的值变了, 图不会跟着变。 有什么 办法吗?

2778 次点击
所在节点    Vue.js
14 条回复
temporary
2021-05-03 23:19:34 +08:00
<img :key="b64img1" :src="b64img1" />
Kasumi20
2021-05-03 23:20:50 +08:00
为什么不会变?不分析以下原因吗?
wunonglin
2021-05-03 23:22:55 +08:00
请提供复现示例
2kCS5c0b0ITXE5k2
2021-05-03 23:51:40 +08:00
```
Vue.set(this, "b64img1", this.b64img2)
```
line
2021-05-04 00:36:00 +08:00
想用 playgroud 复现没有成功, 最后用 canvas 解决了。 😂😂, 多谢各位答疑。
towry
2021-05-04 00:44:36 +08:00
神一样的解决办法
tinyuu
2021-05-04 05:59:23 +08:00
这么复杂吗? 哈哈哈
gouflv
2021-05-04 07:03:20 +08:00
vue 是真的不错,总是能开出很多脑洞
lichdkimba
2021-05-04 07:08:17 +08:00
我试了下可以啊

为啥有两个变量 不是直接 this.b64img1 = 'xxx' 吗
Rrrrrr
2021-05-04 09:31:49 +08:00
哈哈,笑了
err1y
2021-05-04 10:34:07 +08:00
watch 变量,数据变化后 this.$forceUpdate()试试
lybcyd
2021-05-04 10:44:12 +08:00
https://codesandbox.io/s/priceless-heisenberg-mqzrr?file=/index.html
试了一下是完全正常的,你能贴出完整一点的代码吗?
fpure
2021-05-04 11:18:07 +08:00
你需要给出完整代码
GzhiYi
2021-05-04 20:31:49 +08:00
给 img 加 key 可解。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/774786

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX