我是vue的新手.js.我开始迁移我的angularjs应用程序.

我错过了什么?

<template>
    <input type="radio" name="account-type" @click="setAccountType(item.id)"/><span>{{item.name}}</span>
</template>
<script>
  export default {
     data() {
        return { accountType: null
     },
     methods: { setAccountType: (typeId) => this.accountType = typeId
  }
</script>

这不是预期的数据实例,因此ui未更新.

感谢您的帮助.

亲切的问候.

推荐答案

不能使用箭头函数在Vue实例中引用this来获取Vue实例数据,因为this引用window,正确的ES6语法是:

 setAccountType(typeId){
   this.accountType = typeId
 }

带箭头函数的JSFIDLE:https://jsfiddle.net/zxqohh0L/

带非箭头ES6功能的JSFIDLE:https://jsfiddle.net/zxqohh0L/1/

您仍然可以在方法本身内部使用箭头函数.

Vue.js相关问答推荐

如何在与父集合相同的读取中取回子集合(或重构数据?)

当用户在嵌套路由中时激活链接

Vue Js Composition Api 未定义(读取名称)

我如何使用 vuejs 在我的 url 中编码一个令牌

Vue 脚本标签中更漂亮的 destruct 功能

在 Vuex 的状态下动态创建一个响应式数组

Defer推迟执行,直到外部脚本加载到 Vue.js

Nuxt.js 中的开发工具样式编辑问题

未捕获的类型错误:无法读取未定义的属性initializeApp

在 SASS 中使用 Vuetify 类

为什么 CSS 关键帧动画在具有范围样式的 Vue 组件中被 destruct ?

错误:您可能需要额外的加载器来处理这些加载器的结果.

在 vuejs 中将旧代码修改为 vue router 4

VueJS 组件中的图像未加载

如何在 VueJS 中访问 [__ob__: Observer] 的元素?

Vuex - 何时从 http 服务器加载/初始化存储数据

如何从 vue 组件调用 App.vue 中的方法

VS Code - 在 .vue 文件中启用 autoClosingTags 选项

检测 Vue-Router 导航Guards中的后退按钮

Vue.js 显示空格(换行符)