关于用 v-bind 来动态地将 prop 绑定到父组件的数据,下面代码总是不能动态显示数据?求指导

新手上路,请多包涵
<div id="example">
    <input v-model="parentMsg">
    <br>
    <child :myMessage="parentMsg"></child>
</div>
<script>
    new Vue({
        el:'#example',
        data:{
            parentMsg:''
        },
        components:{
            'child':{
                template:'<div>{{myMessage}}</div>',
                prop:['myMessage'],
                data() {
                    return {
                        myMessage:''
                    }
                }
            }
        }
    })
</script>
阅读 3.8k
5 个回答

子组件不要再次声明了

你把data里面的myMessage去掉就好了...你既然prop里面有了传参,为什么又要在data里面重新赋值为空呢

你既然prop进去了,那么子组件就不要再声明了,楼上说的对。
你这里写法有问题,可以看prop的驼峰式写法,标签中间需要加一个横杠。注意细节啊朋友图片描述

哥们,写错了,html是不区分大小写的,要用kebab-case,不能用驼峰~~~

新手上路,请多包涵

1 prop->props
2 注意 HTML中使用kebab-case
3 components里面不用再给myMessage赋值了

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题