logo image
메인
기술
HOME
기술

vue-component 테스트 소스

1
목록
#vue #component
vue 2.6.12 기준

<div id="comp01">
<div>comp1</div>
</div>
<script type="text/x-template" id="comp03">
<div>comp03</div>
</script>
<template  id="comp04">
<div>comp04</div>
</template>
<template  >
<div id="comp05">
<div>comp05</div>
</div>
</template>
<script>
Vue.component("comp01", {
template: '#comp01'
});
Vue.component("comp02", {
template: '<div>comp02</div>'
});
Vue.component("comp03", {
template: '#comp03'
});
Vue.component("comp04", {
template: '#comp04'
});
Vue.component("comp05", {
template: '#comp05'
});
</script>

<script type="module">
// .js을 읽어와서 (이경우 자동으로 해더의 content-type 이 체크됨)
Vue.component("comp06",
() => import("./comp06.vue.js").then(
(res)=>{console.log('load comp06.vue.js',res);return res}
)
);
Vue.component("comp07",
(await import("./comp07.vue.js")).default
);
</script>
<script type="module">
// .vue(html 파일)로 template만 가져올 경우
Vue.component("comp08",{
template:await (await fetch("./comp08.vue")).text()
}
);
</script>

목록
댓글
  • / /
  • No Nickname
    No Comment
  • 권한이 없습니다.
    {{m_row.m_nick}}
    -
목록형 📷 갤러리형
제목
[기본형] HTML (with 부트스트랩5.3 , jquery 3.7, vue.js)
유용한 리눅스(LINUX) 명령어
[공지] 기술 게시판
일
월
화
수
목
금
토
3.31
4.1
4.2
4.3
4.4
4.5
4.6
4.7
4.8
4.9
game_tictactoe
4.10
4.11
4.12
4.13
4.14
4.15
4.16
4.17
:scope selector , querySelector 에서 this, self node 지정
4.18
4.19
4.20
4.21
4.22
4.23
ui_treemap
4.24
4.25
4.26
4.27
4.28
4.29
4.30
5.1
5.2
5.3
5.4
tag