<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
<div id="app">
<banner v-bind:banner="banner"></banner>
<divsword ref="divsword"></divsword>
<!--<div v-text="name"></div>-->
</div>
<script>
Vue.component('banner', {
props: ['banner'],
template: '<div><img v-bind:src="banner" class="allpic" /></div>',
data(){
return{
name:""
}
},watch:{
name:function(){
console.log("sss");
this.$parent.$refs.divsword.names=this.name;
}
}
,mounted(){
var $this = this;
setTimeout(function(){
$this.name ="x44444ic";
},1000)
}
})
Vue.component('divsword', {
template: '<div v-text="names"></div>',
data(){
return{
names:""
}
},mounted(){
var $this =this;
}
})
var app = new Vue({
data(){
return{
}
},mounted(){
}
}).$mount('#app')
</script>
</body>
</html>