구분 | 설명 | 샘플 |
---|---|---|
img 태그 | src 속성 추가 | <img src="/resouce/img/default.png"> |
i 태그 | css 정의된 class 에 따른 아이콘 이미지 노출 role 속성 추가 ex. role="image" | <i class="icon-img-00" role="image"> |
// props
propElTag: {type: String, default: 'img'},
propImgPath: {type: String, default: '/resouce/img/default.png'},
propClassTxt: {type: String, default: 'icon-img-00'},
propRoleVal: {type: String, default: 'image'},
// computed
isImgTag: function() {
return this.propElTag === 'img';
},
<component
:is="isImgTag ? 'img' : 'i'"
:src="isImgTag ? propImgPath : null"
:class="isImgTag ? null : propClassTxt"
:role="isImgTag ? null : propRoleVal"
></component>