<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Vue 组件 props</title>
<script type="text/javascript" src="../assets/js/vue.js"></script>
</head>
<body>
<h1>Vue 组件 props</h1>
<hr>
<div id="app">
<whl here="河南">
</whl>
<whl v-bind:here="message">
</whl>
</div>
</body>
</html>
<script>
var app = new Vue({
el:'#app',
data:{
message:'四川'
},
//局部组件 如果属性中 有 - 例如 from-here 这样写法 在Vue中需要改成小驼峰的格式 fromHere 就可以认识
components:{
'whl':{
template:`<div style="color:green"> 我是从{{here}}来的</div>`,
props:['here']
}
}
});
</script>