vue.js 전역 구성 요소
2036 단어 vue.js
방법 1 이것은 사용하기 쉽고 편리하다.
<script src="vue.js" type="text/javascript" charset="utf-8"/>
<div id="div">
<!-- -->
<demo/>
<demo/>
<demo/>
</div>
<div id="div2">
<demo/>
<demo/>
<demo/>
</div>
<!-- -->
<template id="tmp">
<!-- html ， ， -->
<div>
<p>{{ msg }}</p>
<h1>{{ name }}</h1>
</div>
</template>
<script type="text/javascript">
//
Vue.component('demo',{
//
template:"#tmp",
//
data:function(){
return{
msg:'hello',
name:'leition'
}
},
//
methods:{
fn:function(){
alert('OK!')
}
}
});
var vm = new Vue({
el:'#div'
})
var vm2 = new Vue({
el:'#div2'
})
</script>
</code></pre>
<p><strong> </strong><br/> , </p>
<pre><code>
<meta charset="UTF-8"/>
<title/>
<script src="vue.js" type="text/javascript" charset="utf-8"/>
<div id="div">
<demo/>
</div>
<script type="text/javascript">
Vue.component('demo',{
template:"<div><p>{{ msg }}</p><h1 @click='fn()'>{{ name }}</h1></div>",
data:function(){
return {
msg: 'hello',
name: 'leition'
}
},
methods:{
fn:function(){
alert('lala');
}
}
});
var vm = new Vue({
el:'#div'
})
</script>
</code></pre>
<p> ：https://blog.csdn.net/qq_39383675/article/category/8256374</p>
</div>
</div>
</div>
</div> 이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
[백견불여일타/Vue.js] 4장 - 입력 폼 데이터 가져오기v-model 데이터 입력 select 지난 장에서는 v-bind를 이용해서 HTML 태그 속성 값을 Vue로 다루는 법을 배웠습니다. 이번에는 사용자가 입력한 데이터를 Vue로 가져오는 법에 대해 다룹니다. 웹 페...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
