【vue 之坑】:style设置背景图片（backgroundImage）会发起一个 undefined 的请求

背景

系统监控发现页面有异常请求：

https://test.test.com/test/test/zh/undefined （404 Not Found）

控制台报了一个 404 的错误，但是页面展示正常，逻辑未受到影响。

出现问题的页面代码：

其中 data.imgUrl为接口返回数据。

原因&解决

实际上出现这个问题主要是由于 vue 的渲染机制，解决方法也很简单：

1. 给url的变量设置一个默认值
2. 判断接口请求完再进行页面渲染

例如：

或者

...

data() {
    return {
        pageReady: true
    }
}