使用 v-if 时，vue.js 是否不会触发 img 的加载事件? [英] Does vue.js not trigger a load event for img when v-if is used?

问题描述

我想让社交登录用户在必要时有机会退出.

I want to give users of a social login the chance to logout when necessary.

如果添加一个调用注销 url 的 img，那么当注销完成时，我想删除按钮，但不会触发 img 的加载.此处发布了一个类似的问题 此处.就我而言，初始 signouturl 是一个空字符串.

To do so if add an img that calls the logout url, when the logout is done I want to remove the button but the onload of the img is not triggered. Here a similiar issue is posted here . In my case the initial signouturl is an empty string.

<button v-on:click="signout(socialLogout.provider)">
Logout
<img v-if="socialLogout.signoutUrl" hidden v-bind:src="socialLogout.signoutUrl" v-on:load="signout"/>
</button>

工作流程是1. 用户登录2. 按钮可见，logouturl 填充 "https://www.google.com/accounts/Logout"3. 用户点击按钮，img-request 完成，google 登出.但是 img-tag 中的 v-on:load 函数没有被触发.

The workflow is 1. users does login 2. button gets visible, logouturl is filled with "https://www.google.com/accounts/Logout" 3. user clicks the button, the img-request is done, google does the logout. BUT the v-on:load function in the img-tag is not triggered.

我用 $nextTick 做了一个解决方法来完成我的任务，但如果这可能是 vuejs 内部的错误，我仍然很受伤?

I did a workaround with $nextTick to accomplish my task but i am still wounding if this might be a bug inside vuejs?

推荐答案

是的，正如您在此示例中看到的那样:https://codesandbox.io/s/ym91z4wkz.

Yes it is triggered as you can see on this example: https://codesandbox.io/s/ym91z4wkz.

您的问题可能是 src url 不是图像，所以这就是事件没有触发的原因.正如您所看到的，当 src 是图像时会触发这里的 onload 事件，但对于您的 url 则不是.

Your problem is probably that the src url is not to an image, so that's why the event doesn't fire. As you can see the onload event here is fired when src is to an image, but with your url it is not.

这篇关于使用 v-if 时，vue.js 是否不会触发 img 的加载事件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！