Vue.js에서 속성과 메서드를 재정의하는 적절한 방법?

Vue.js에서 속성과 메서드를 재정의하는 적절한 방법?

Vue.js에서 mixin을 사용하여 메서드를 재정의하는 적절한 방법은 무엇입니까?믹스인을 사용하여 상속을 모의할 수 있다는 것은 알지만 일부 소품을 확장하고 싶지만 전체 소품 값을 완전히 무시하지는 않는다고 가정해 봅시다.

예를 들어 baseCell을 가지고 있지만, 비슷한 컴포넌트이지만 기능하는 컴포넌트가 필요합니다.<td>및<th>s, baseCell을 믹스로 사용하는 컴포넌트를 2개 더 만듭니다.

var baseCell = {
  ...
  props: {
    ...
    initWrapper: {
      type: String,
      default: 'td'
    },
    ...
  },
  methods: {..}
};

컴포넌트에서 소품을 그렇게 설정하면 모든 값이 완전히 덮어씁니다.

Vue.component('tableHeader', {
  mixins: [baseCell],
  props: {
    initWrapper: {
      default: 'th'
    }
  }
}

속성을 병합하는 솔루션을 생각해 냈지만, 좀 엉터리인 것 같고, 더 나은 해결책이 있을지 모르겠습니다.

Vue.component('tableHeader', {
  mixins: [baseCell],
  props: Object.assign({}, baseCell.props, {
    initWrapper: {
      default: 'th'
    }
  })
});

이것으로 baseCell 소품은 유지하지만 오브젝트 내에서 정의된 소품은 통과했습니다.

Vue > 2.2에서는 커스텀옵션 머지 전략을 사용하여 원하는 것을 달성할 수 있습니다.이 전략은 모든 믹스인에 적용됩니다.

예를 들면, 다음의 메뉴얼을 참조해 주세요.https://vuejs.org/v2/guide/mixins.html#Custom-Option-Merge-Strategies

언급URL : https://stackoverflow.com/questions/40639128/proper-way-to-override-properties-and-methods-in-vue-js