<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>vue1</title>
<script src="https://cdn.bootcss.com/vue/2.6.11/vue.js"></script>
<link rel="stylesheet" type="text/css" href="vue.css">
</head>
<body>
<div id="app">
<comp :msg="msg"></comp>
</div>
<script>
var comp={
//父组件传给子组件可以进行值校验,
props:{
msg:{
type:String,
//required:true,
default:"hello,sa"
// validator:function(){
// }
}
},
template:`<div>{{msg}}</div>`,
//父组件传来的值要先接收,再修改
data(){
return {
info:""
}
},
created:function(){
this.info=this.msg+"ttt"
console.log(this.info)
}
}
var app=new Vue({
el:"#app",
data:{
msg:"aaa"
},
components:{
comp
}
})
</script>
</body>
</html>
来源:https://www.cnblogs.com/JinweiChang/p/12657768.html