방법 내부에서 데이터에 액세스하는 방법

저는 vue.js를 처음 사용했습니다. 내 angularjs 앱을 이전하기 시작했습니다. 새로운 단순 웹팩 프로젝트를 생성하기 위해 vue cli를 사용하고 있습니다. 새로운 webpack + vueLoader 프로젝트가 생성됩니다. 모든 것이 순조롭게 진행되었지만 지금은 문제가 있습니다. 내 @click 이벤트 내 데이터를 변경하려고하지만 개체에 액세스 할 수 없습니다. 'this'는 데이터 인스턴스가 아닙니다.방법 내부에서 데이터에 액세스하는 방법

무엇이 여기에 있습니까?

<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>

이것은 예상 한 데이터 인스턴스가 아니므로 업데이트되지 않습니다. vuejs doc에서이 방법으로는 충분하다고 판단 할 수 있습니다. vue js doc

도움이 되었습니까?

친절하게 제공합니다.

당신은 this이 window 참조하기 때문에 뷰 인스턴스 데이터를 얻을 수있는 뷰 인스턴스 내부에 this를 참조 화살표 기능을 사용할 수 없습니다

출처

2016-12-13 Gal Ziv

는 올바른 ES6 구문은 다음과 같습니다 화살표 기능

setAccountType(typeId){ 
    this.accountType = typeId 
}

JSFiddle : https://jsfiddle.net/zxqohh0L/

JS34 기능이없는 JSFiddle : https://jsfiddle.net/zxqohh0L/1/

메소드 내에서 화살표 기능을 사용할 수 있습니다. 자아

출처

2016-12-13 11:19:36

뛰어난 대답. 매우 노력해 주셔서 감사합니다. –

아주 좋은 설명입니다. 저는 화살표 기능이있는 함수 내부의 데이터에 액세스하려고했습니다. 귀하의 답변은 실제로 제 문제를 해결했으며 이해를 돕습니다. – krrr25

대단히 감사합니다! 2 시간이 낭비되었습니다. 나를 미치게 만들었다. –

방법 내부에서 데이터에 액세스하는 방법

답변

관련 문제