属性传值,子组件道具接收
& lt; !DOCTYPE html>
& lt; html>
& lt; head>
,& lt;元charset=癠TF-8"祝辞
,& lt; title> & lt;/title>
& lt;/head>
& lt; body>
& lt; div id=癮pp"在
,& lt; parent> & lt;/parent>
& lt;/div>
& lt;脚本src=https://www.yisu.com/zixun/" js/vue.min.js ">
& lt; script>
,//1:创建父组件
,Vue.component (“parent" {
,,,,数据:函数(){
,,,,,返回{钱:3000}
,,,,},
,,,,模板:“
,,,,& lt; div>
,,,,,& lt; h5>父组件& lt;/h5>
,,,,,& lt;孩子:myValue=https://www.yisu.com/zixun/"钱">
,,,,& lt;/div>
,,'
,});
,//2:创建子组件
,Vue.component (“child" {
,,模板:“& lt; div> & lt; h4>子组件& lt;/h4>
,,,{{myValue}}
,,& lt;/div> "
,,道具:“myValue",,//声明变量保存父组件数据
,,安装:函数(){
,,,//声明变量结束,获取父元素数据。
,,,//己存保存。数据
,,,console.log (this.myValue);
,,}
,});
,//3:创建Vue
,新Vue ({el:“# app"});
& lt;/script>
& lt;/body>
& lt;/html>
,,& lt; my-login> & lt;/my-login>
, & lt;/div>
,,https://www.yisu.com/zixun/& lt;脚本src=" vue.min.js ">
& lt; script>
,Vue.component (“my-login" {
,,模板:“
,& lt; div>
,,,& lt; h4>父组件& lt;/h4>
,用户名
, & lt;我的输入提示=坝没白４? lt;/my-input>
,,,,,,,密码
, & lt;我的输入提示=懊苈搿白４? lt;/my-input>
,& lt;/div>”
,});
,Vue.component (“my-input" {
,,道具:[& # 39;小贴士# 39;],
模板:“
,,& lt;输入类型=皌ext":占位符=皌ips"/在
"
,});
,新Vue ({el:“# app"});
& lt;/script>
, & lt;/body>
