子組件如果想修改父組件的屬性是不可能的， 也不推薦， 不能直接改難道就沒有辦法呢
難不了，優秀的vue 同學 ，先看張圖吧
從這張圖 可以看出兩個問題
1.父傳值給子 需要用 props ，
2. 子傳值給父 需要 emit 事件.
看下邊實例吧，我自己學的 ：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" >
<link href="https://cdn.bootcss.com/flat-ui/2.3.0/css/flat-ui.min.css" rel="stylesheet">
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"> </script>
</head>
<body>
<div id="pp" >
<!--把父組件的方法綁定到func-->
<login v-bind:parmsg="msg" @func="show"></login>
</div>
<template id="tmp1">
<!--調用了子組件的myclick方法-->
<input type="button" value="請點擊" @click="myclick" >
</template>
<div>
<script>
var login= { // 設置子組件對象
template:'#tmp1',
props:['parmsg'],
data(){
return {
son:{
name:30,
age:20
}
}
},
methods: {
myclick(){ //定義子方法
this.$emit('func',this.son) //通過emit 進行把值傳入func
}
}
}
var vue=new Vue({
el:'#pp',
data: {
son:'',
msg:'我是父組件'
},
methods:{
show(data){
alert(data.name)
alert(data)
this.son=data
alert("傳遞的值"+this.son.age)
}
},
components:{ //創建子組件
login: login,
}
}
)
</script>
</div>
</body>
</html>