我照着老师的视频跟着写了一遍代码，两个child，点击上面的dell下面的跟着改变，但是点击下面的lee上面的dell不会变-慕课网

2回答

提问者慕移动1599698 2018-05-10 20:00:33

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script src="vue.min.js"></script>
</head>
<body>

<div id="root">
<child content="dell"></child>
<child content="hello"></child>
</div>
<script>
Vue.prototype.bus=new Vue()
Vue.component('child',{
props:{
content:String
},
data:function(){
return {
selfContent:this.content
}
},
template:'<div @click="handleClick">{{selfContent}}</div>',
methods:{
handleClick:function(){
this.bus.$emit('changed',this.selfContent)
}
},
mounted:function(){
This=this;
this.bus.$on('changed',function(value){
This.selfContent=value;
console.log(value)
})
}
})
var vm=new Vue({
el:"#root"
})
</script>
</body>
</html>

0 回复有任何疑惑可以回复我~

收起回答

weibo_落叶code_0 2018-05-10 07:55:57

代码贴出来看看

0 回复有任何疑惑可以回复我~

收起回答

提问者慕移动1599698 #1

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="vue.min.js"></script>
</head>
<body>
<!--Bus/总线机制/发布订阅模式/观察者模式-->
<div id="root">
    <child content="dell"></child>
    <child content="hello"></child>
</div>
<script>
    Vue.prototype.bus=new Vue()
    Vue.component('child',{
        props:{
            content:String
        },
        data:function(){
            return {
                selfContent:this.content
            }
        },
        template:'<div @click="handleClick">{{selfContent}}</div>',
        methods:{
            handleClick:function(){
                this.bus.$emit('changed',this.selfContent)
            }
        },
        mounted:function(){
            This=this;
            this.bus.$on('changed',function(value){
                This.selfContent=value;
                console.log(value)
            })
        }
    })
    var vm=new Vue({
        el:"#root"
    })
</script>
</body>
</html>

回复有任何疑惑可以回复我~ 2018-05-10 20:17:08

qq__9987 回复提问者慕移动1599698 #2
```
你This=this，这里写错了，这样写是全局变量，应该是var This=this;
```
回复有任何疑惑可以回复我~ 2018-05-21 13:02:32
提问者慕移动1599698 回复 qq__9987 #3
```
谢谢 谢谢
```
回复有任何疑惑可以回复我~ 2018-06-25 21:55:27

我照着老师的视频跟着写了一遍代码，两个child，点击上面的dell下面的跟着改变，但是点击下面的lee上面的dell不会变

正在回答回答被采纳积分+3

2回答

相似问题

请选择置顶位置

本课精华内容

今天新建了一个分支，git pull时发现报错

我的也是，进入的动画没有效果

首页swiper的轮播失效

6-3 按老师的操作改了路由但是显示主页的仍然是去哪儿网的页面

swiper找不到module

【讨论题】Composition API 应用时注意得问题

【讨论题】Composition API 产生背景及解决问题

【讨论题】作为前端，你在开发中是如何进行代码调试 Debug

【讨论题】移动端项目的开发过程中，你遇到过怎样的兼容性问题？

【讨论题】对前端数据管理框架，你有怎样的理解？

热搜

最近搜索清空