vue.js 2에서 제출하는 버튼의 유형 속성을 어떻게 바꿀 수 있습니까?

Question

나는 다음과 같은 시도 :

다음과 같은 오류를 제공

<template> 
    <button @click="checkout" class="btn btn-danger pull-right" :type="typeButton"> 
     Checkout 
    </button> 
</template> 
<script> 
    export default { 
     methods: { 
      data() { 
       return { 
        typeButton: 'submit' 
       } 
      }, 
      checkout(e) { 
       this.typeButton = 'button' 
       ... 
      } 
     }, 
    } 
</script> 

가 :

[Vue warn]: Property or method "typeButton" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option.

가 어떻게이 문제를 해결할 수 있습니까?

Answer 1

그래서 당신 methods: {}

에서 당신의 data(){} 객체를 이동

, 당신의 export은 다음과 같아야합니다

export default { 
    data() { 
    return { 
     typeButton: 'submit' 
    } 
    }, 
    methods: { 
    checkout(e) { 
     this.typeButton = 'button' 
    } 
    }, 
}