Vue 不会在生产模式下更新 API 调用加载的组件 prop，而是在开发中更新

Question

我有一个包装器组件，它为孩子们提供API调用并存储结果，还有一个列表组件，它显示通过prop传递的请求项目。问题是它在开发模式下显示它们，但在生产模式下没有，尽管 API 调用在两种情况下都可以，并且响应是正确的。

两种模式我都在相同的环境中运行。看起来像一个反应性问题。

这是一个模板代码：

<vue-api>
<vue-list-filter-synchronizer slot-scope="{ result, getPrograms }"
...
@params-updated="getPrograms">
...
<div class="content">
<vue-list :items="result ? result.data : []"
.../>
</div>
</vue-list-filter-synchronizer>
</vue-api>

VueAPI 组件：

const VueAPI = {
data() {
return {
result: null,
error: null,
loading: false
}
},
...
methods: {
getPrograms(params) {
this.query(services.getPrograms)([params]);
},
query(f) {
return (args=[]) => {
if (!this.loading) {
this.loading = true;
f(...args)
.then(({ data }) => this.result = data)
.catch(error => this.error = error)
.finally(() => this.loading = false);
}
}
},
render() {
return this.$scopedSlots.default(this.slotScope);
}
}

我希望 VueAPI 组件中的result.data将在开发和生产模式下显示为列表项，但仅在开发模式下如此。

Answer 1

首先，我的 vue.debug.js 有一个旧版本，因此它可以使用它并且没有它。当我更新它时，问题也出现在调试模式下。 其次，问题是我对插槽范围使用了已弃用的语法。当我将其更改为 v 槽语法时，一切都开始按预期工作。