<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>使用-Prop-传递数据</title>
<script src="vue.js"></script>
</head>
<body>
<div id="app">
<!--传入值到子模板的props-->
<child my-message="hello!"></child>
<!--绑定父组件的数据到子模板的props-->
<child2 v-bind:cm="parentMsg"></child2>
</div>
<script>
Vue.component(‘child‘, {
props : [‘myMessage‘],
template : ‘<span>{{ myMessage }}</span>‘
})
Vue.component(‘child2‘, {
props : [‘cm‘],
template : ‘<span>{{ cm }}</span>‘
})
new Vue({
el : ‘#app‘,
data : {
parentMsg : ‘parentMsg‘
}
})
</script>
</body>
</html>
时间： 2024-11-10 04:45:20