Question

我有这个Vue组件，它根据数据属性item.stars显示图像。

它在localhost上工作正常，但在我的生产服务器上不起作用。显示第一个图像，并且我可以看到应该显示其他两个图像的Vue属性，但是由于某些原因这些未显示。

JS代码有什么问题吗？此代码如何在localhost上运行？

任何帮助将不胜感激。

<img v-lazy="'/uploads/' + item.images[0].image_path + '_small.jpg'" :alt="item.name" style='height: auto'>

<img src='/icons/unique2.png' v-if="(item.stars.filter(e => e.star_type === 2).length > 0)" style="position: absolute; left: 0; top: 0; width: 30%;">

<img src='/icons/Star-01.png' v-if="(item.stars.filter(e => e.star_type === 1).length > 0)" style="position: absolute; right: 0; top: 0; width: 20%;">

Answer 1

要解决您的问题，请通过Chrome浏览器访问您的生产链接网站，当它打开时，单击F12 /或右键单击页面，然后选择检查以打开chrome控制台。在您的情况下，控制台很可能会在JavaScript代码中显示错误，如果您解决了出现的这些错误，则该网站将通过生产模式运行，此外，请确保您涵盖/避免了以下几点。

为什么会出现此问题的要点：

您正在通过http代理Internet或通过内部闸门方式浏览生产站点，这会阻止您站点中使用的某些端口
您的javascript错误（可能是页面内容/图像的路径）
您使用的是过时的浏览器
与您的服务器Internet连接甚至客户端Internet连接有关的超时问题
您尚未为网站上使用的文件夹路径设置适当的访问权限
您尚未发布所有支持的文件以从服务器上查看
使用文件的许可证也可能显示此问题
您正在通过VPN连接浏览您的网站，因此请禁用它，然后重试。
有关您的网站内容中使用的文件扩展名/类型的问题
复制您网站上已使用的javascript库的负载（很可能是您的问题，尽管我无法在所提供的问题信息中看到它）
与您网站上使用的JavaScript库/版本冲突

希望这可以为您解决问题。

祝你好运

Answer 2

所以我最终确定了问题：更换

img v-if =“（item.stars.filter（e => e.star_type === 2）.length> 0）”

与

img v-if =“（item.stars.filter（e => e.star_type == 2）.length> 0）”

该代码可在我的服务器上运行。

JS代码可在localhost上运行，但不适用于生产

2 个答案: