Javascript Vue.js 3.0:从方法读取和设置对象属性

我正在学习和创建Vue应用程序。当我尝试设置属性时，会出现如下错误，无法读取未定义的属性“Selected.type” 这就是我尝试的方式：

<script>
 export default {
  data() {
    return {
      info: {},
      Selected: {
            type: '',
            country: '',
        }
    };
  },
  methods: {
fetchData () {
  fetch(`https://data.brreg.no/enhetsregisteret/api/enheter/983609155`)
    .then( resp => resp.json())
    .then((data) => (this.info = data))
    .then(function (data) {
     console.log(data.organisasjonsform.beskrivelse);
     this.Selected.type=data.organisasjonsform.beskrivelse;
     
     })
    .catch(err => console.error(err))
}
  },
  mounted() {
    this.fetchData();
  },
  
};
</script>

导出默认值{
数据（）{
返回{
信息：{}，
选定：{
类型：“”，
国家：“，
}
};
},
方法：{
获取数据（）{
取回(`https://data.brreg.no/enhetsregisteret/api/enheter/983609155`)
.then（resp=>resp.json（））
.然后（（数据）=>（this.info=数据））
.then（功能（数据）{
console.log（data.organisasjonsform.beskrivelse）；
this.Selected.type=data.organisasjonsform.beskrivelse；
})
.catch（err=>console.error（err））
}
},
安装的（）{
这是fetchData（）；
},
};

---

为什么我会犯这个错误？我是VueJS的新手。有人能帮我吗？

这应该行得通，我没有试过，但很明显。 您必须在选择

之前添加“this”。键入
以访问它

编辑：
糟糕的是，我完全忘记了函数上下文。我想，如果在发布之前不运行代码，就会发生这种情况

  fetch(`https://data.brreg.no/enhetsregisteret/api/enheter/983609155`)
    .then( resp => resp.json())
    .then((data) => (this.info = data))
    .then((data) => {
     console.log(data.organisasjonsform.beskrivelse);
     this.Selected.type=data.organisasjonsform.beskrivelse;
     
     })
    .catch(err => console.error(err))
}

这是因为
此
引用的是回调函数的执行上下文，而不是Vue组件。这是由于使用
函数
-关键字来声明回调而不是较新的
（）=>{}
语法造成的

如果您将代码更改为：

fetch(`https://data.brreg.no/enhetsregisteret/api/enheter/983609155`)
    .then( resp => resp.json())
    .then((data) => (this.info = data))
    .then((data) => {
       console.log(data.organisasjonsform.beskrivelse);
       this.Selected.type=data.organisasjonsform.beskrivelse;
    })

它应该会起作用

另一种语法是在
fetchData
-方法的闭包内的变量中捕获
this
上下文

fetchData () {
  const self = this;
  fetch(`https://data.brreg.no/enhetsregisteret/api/enheter/983609155`)
    .then( resp => resp.json())
    .then((data) => (this.info = data))
    .then(function (data) {
       console.log(data.organisasjonsform.beskrivelse);
       self.Selected.type=data.organisasjonsform.beskrivelse;
     })
    .catch(err => console.error(err))
}

如果这不是解决办法。我已经试过了。是的，我很糟糕，我完全忘记了函数上下文。避免在Vue中使用“function”关键字……但我想你可以使用它Vue composition api