VueJ에서 단일 계산 프로포트를 사용하여 여러 동적 속성을 지정하는 방법s

VueJ에서 단일 계산 프로포트를 사용하여 여러 동적 속성을 지정하는 방법s

html 요소는 다음과 같습니다.

<a href="javascript:">Link text</a>

추가하고 싶다data-tooltip그리고.title조건에 따라 동적으로 속성을 지정합니다.

<a href="javascript:" data-toggle="tooltip" title="Some tooltip text">Link text</a>

VueJ에서 여러 동적 속성을 동시에 추가할 수 있는 방법이 있습니까?

<!-- instead of this: -->
<a href="javascript:" :data-toggle="computedPropTooltipToggle" :title="computedPropTooltipTitle">Link text</a>

<!-- something like this: -->
<a href="javascript:" ...tooltipAttributes >Link text</a>

이 기능을 활용하실 수 있습니다.v-bind동적으로 변화하는 조건에 따라 여러 속성을 적용하는 DOM 요소.

다음은 Plunker의 예를 제시하겠습니다.

반환되는 오브젝트에 주의해 주세요.

computed: {
  multiAttrs() {
    return this.showAttrs ? {
      'data-toggle': 'tooltip',
      title: 'Some tooltip text',
    } : null;
  }
}

사용할 수 있어야 합니다.v-bind="tooltipAttributes"

여기 https://vuejs.org/v2/api/ #v-documents에 더 많은 정보가 있지만 주요 부분은 사용 중입니다.

하나 이상의 속성 또는 구성 요소 소품을 식에 동적으로 바인딩합니다.

언급URL : https://stackoverflow.com/questions/47466667/how-to-specify-multiple-dynamic-attributes-by-single-computed-prop-in-vuejs