컴포넌트 내 믹스인 콜방식(Vuej)

컴포넌트 내 믹스인 콜방식(Vuej)

컴포넌트에서 mixin 메서드를 호출할 수 없습니다.이 에러가 표시됩니다.this.hello is not a function.

전화할 수 있다hello()컴포넌트 내에서는 호출할 수 없습니다.

무슨 일이야?!

<div id='vue-app'>
  <cmp></cmp>
</div>

const mixin = {
  methods: {
    hello() {
      return 'Hello World!';
    }
  },
  created() {
    console.log('Mixin Created!');
  },
};

const cmp = {
  created() {
    console.log('From Cmp:', this.hello());
  },
};

new Vue({
  components: {
    cmp
  },
  el: '#vue-app',
  mixins: [mixin],
  created() {
    console.log('From VM:', this.hello());
  },
});

https://jsfiddle.net/ar464soq/

정답입니다. mixin 메서드/데이터는 추가된 인스턴스에서만 사용할 수 있습니다.단, 루트 인텐션에서 믹스인을 정말 원하는 경우 전화할 수 있습니다.this.$root.hello()루트 인스턴스의 모든 하위 구성 요소에서

Vue 부모 인스턴스가 아닌 컴포넌트 인스턴스 전체에 Mixin을 로드해야 할 것 같습니다.

nuxt를 vue @daxigu와 함께 사용하면 vue @daxigu가 동작하지 않습니다.$root자기 자신이다.내가 뭘 할 수 있을까?이것은, 다음과 같습니다.

this.$root.$children[1].myRootMethod()

• $root: 아까 말씀드렸듯이 이것은 nuxt입니다.

• $children [ 0 ] :는 Nuxtloading 입니다.

• $children [ 1 ] :는 메인 컴포넌트입니다.저의 경우는, 몇개의 글로벌 컴포넌트와 글로벌 믹스인 베이스 레이아웃이었습니다.

도움이 됐으면 좋겠다.

언급URL : https://stackoverflow.com/questions/47109790/call-methods-of-mixin-within-component-vuejs