首页 > 代码库 > Vue2父子组件通信探究
Vue2父子组件通信探究
父组件:
<template> <div id="secondcomponent"> <input type="" v-model="parentMsg"> <child :my-message="parentMsg"></child> </div> </template> <script> import child from ‘../components/Hello.vue‘ export default { data () { return { parentMsg: ‘父组件数据!可以根据input输入实时改变。‘ } }, components: { child } } </script>
子组件
<template> <div class="hello"> {{myMessage}} </div> </template> <script> export default { name: ‘child‘, props: [ ‘myMessage‘, ], mounted(){ console.log(this.myMessage); } } </script>
给子组件传递数据使用v-bind
动态绑定到子组件上!
Vue2父子组件通信探究
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。