不，没有那么复杂。
我正在创建一个通用的httpService文件，从该文件将调用我的所有http调用。在http状态403上，我想重定向到"/profile"路由。重定向后显示错误
[Vue warn]：计算属性"errors"已在数据中定义。
在中找到
--->位于resources/js/components/Admin/Profile.vue
看起来这是一个数据声明冲突。
httpservice.js
getRequest: function (parameters,callBackFunction) {
let response = '';
let url = 'url' in parameters ? parameters["url"] : "";
let data = 'data' in parameters ? parameters['data'] : "";
axios
.get(url,{
params:data
}).then(data => {
if(data.status == 200){
response = data.data.data;
callBackFunction(response);
}
}).catch(error => {
if(error.response.status == 403){
console.log(router);
router.push({path: '/profile'});
}
});
}
profile.vue
data() {
return {
errors: [],
form: new Form({
password: "",
new_password: "",
confirmed_password: ""
}
计算的属性取决于数据属性中定义的值。这些属性将直接扩展/分配到Vue实例中(这样您就可以调用this.errors)。
因此，不能在data和computed对象中重复使用相同的属性名称。因为重用名称意味着覆盖现有数据，这意味着计算值不能再依赖于数据值。
在你的代码中，你只显示：
data() {
return {
errors: [],
form: new Form({
password: "",
new_password: "",
confirmed_password: ""
}
根据错误：
[Vue warn]：计算的属性"错误"；已在数据中定义。
我相信你也写过这样的东西：
computed: {
...
errors: function(){}
...
}
Profile.vue中。只需更改其中一个名称即可解决您的问题。
编辑
证明问题：
new Vue({
el: '#app',
data(){
return {
errors: [
'error 1',
'error 2'
]
}
},
computed: {
errorString(){
return `Errors: ${this.errors.join(', ')}.`
}
},
template: `<div id="app">{{errorString}}</div>`
});<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app"></div>上面的操作很好，而下面的操作会导致意外的结果和你得到的相同的Vue警告：
new Vue({
el: '#app',
data(){
return {
errors: [
'error 1',
'error 2'
]
}
},
computed: {
errors(){
return `Errors: ${this.errors.join(', ')}.`
}
},
template: `<div id="app">{{errors}}</div>`
});<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app"></div>