Javascript 如何在Vue.js中导出命名实例，请停止使用：var app=this

我正在vue cli创建的网页包项目中使用.vue模板

我通常使用“导出默认值”导出文件，如下所示：

 export default {
   data () {
     return {
       message:''
     };
 },
 ...

在脚本的后面，当我尝试访问实例时，它似乎在任何函数或第三方库（如axios）中，我必须在顶部编写类似的内容：

 var app = this;

因此我可以访问数据属性…例如：

    var app = this;

    axios.post('https://test.com/api/getMessage',{}).then(res => {
        app.message = res.data.message
    })
    .catch(error => {
        console.log(error)
    });

但是调用var-app=这个；所有的时间都让人厌烦

我更愿意将实例放在如下变量中：

 let app = {
  data () {
    return {
       message:''
  };
 },
 methods :{
   getMessage:function(){

        axios.post('https://test.com/api/getMessage',{}).then(res => {
            app.message = res.data.message
        })
        .catch(error => {
            console.log(error)
        });
   } 
 }  
}

但我不知道如何正确地导出或导入它。似乎每个示例都使用导出默认值。因此，重申我的问题，是否有更好/更智能的方法导出和导入脚本，这样我就不必编写：

 var app = this; 

这应该行得通-箭头函数发生在编写它们的范围内，这意味着

此

将引用那里的Vue实例。如果未使用箭头函数，则必须专门绑定作用域：

axios.post('https://test.com/api/getMessage',{}).then(function(res){
    this.message = res.data.message
}.bind(this))

这应该行得通-箭头函数发生在编写它们的范围内，这意味着

此

将引用那里的Vue实例。如果未使用箭头函数，则必须专门绑定作用域：

axios.post('https://test.com/api/getMessage',{}).then(function(res){
    this.message = res.data.message
}.bind(this))

---

---

只需在你的回调中使用

这个

，而不是应用程序。我已经尝试过了，比如this.message=response.data.message，但由于某种原因，它会在回调中中断，那么你没有发布的内容就错了。如果您的代码是您在那里最后发布的，则取消应用程序，那么由于箭头功能，

此

将是Vue。即使假设您是对的，我可以使用

此.message

，如果我更喜欢使用

应用程序.message

，我该怎么办？有没有比在每个方法中都必须编写

var-app=this

更好的方法？以您描述的方式使用

app

在组件中是行不通的。在本例中，

app

指的是单个对象，您可以潜在地导出该对象。但是这个对象是用来创建组件的，它不是组件本身。有时你会看到人们创建Vue（

const-app=new-Vue（…）

）时所描述的内容，但这是一种黑客行为，是由于不正确理解如何引用Vue而导致的一种不良做法。只需在回调中使用

而不是应用程序。我已经尝试过了，例如this.message=response.data.message，但由于某些原因，它会在回调中中断，那么您没有发布的内容是错误的。如果您的代码是您在那里最后发布的，则取消应用程序，那么由于箭头功能，
此
将是Vue。即使假设您是对的，我可以使用
此.message
，如果我更喜欢使用
应用程序.message
，我该怎么办？有没有比在每个方法中都必须编写
var-app=this
更好的方法？以您描述的方式使用
app
在组件中是行不通的。在本例中，
app
指的是单个对象，您可以潜在地导出该对象。但是这个对象是用来创建组件的，它不是组件本身。有时你会看到人们创建Vue时所描述的内容（
const app=new Vue（…）
），但这是一种黑客行为，是由于不正确理解如何引用Vue而导致的错误做法。谢谢，这确实帮助我理解为什么它不起作用。我最初使用的是旧的function（）语法。但是，如果可能的话，我仍然更愿意使用
app.message
而不是
this.message
。但我不想在每个方法中都声明
var-app=this
。当我创建组件时，我更喜欢在顶部调用它，然后可以在组件中的任何地方访问它。我明白你的意思。您能否按照第二个示例中的方式进行尝试，然后使用
导出默认应用程序在最后？我真的很喜欢使用
这个
，因为我来自Laravel和其他面向对象框架，所以如果您使用
这个
一段时间，您可能会习惯它
此
将在组件代码上全部使用，因此您可以尝试习惯它。请参阅本例中的
Test.vue
。正如我在上面解释的，它不适用于组件。我不知道我可以做像导出默认应用程序这样的事情，这非常有用。我确信使用
这个
对很多人来说都很好，但必须有一个替代选项。谢谢谢谢你，这确实帮助我理解为什么它不起作用。我最初使用的是旧的function（）语法。但是，如果可能的话，我仍然更愿意使用
app.message
而不是
this.message
。但我不想在每个方法中都声明
var-app=this
。当我创建组件时，我更喜欢在顶部调用它，然后可以在组件中的任何地方访问它。我明白你的意思。您能否按照第二个示例中的方式进行尝试，然后使用
导出默认应用程序在最后？我真的很喜欢使用
这个
，因为我来自Laravel和其他面向对象框架，所以如果您使用
这个
一段时间，您可能会习惯它
此
将在组件代码上全部使用，因此您可以尝试习惯它。请参阅本例中的
Test.vue
。正如我在上面解释的，它不适用于组件。我不知道我可以做像导出默认应用程序这样的事情，这非常有用。我确信使用
这个
对很多人来说都很好，但必须有一个替代选项。非常感谢。