脑补 vue中父组件改变子组件中的数据data
需求: 在父组件的一个事件可以改变子组件中的 openData 的值变为 true。 废话不多说,直接上代码: 父级页面: <template> <div> <div @click="changeChild">按钮改变子组件数据</div> <children ref="childrenDom"></children> </div> </template> <script> import Childrens from ".../childrens" export default { components: { Childrens }, methods: { changeChild() { this.$refs.childrenDom.openData = true } } } </script> 注: this.$refs.childrenDom就是指的childrenDom DOM元素 子组件页面: <script> export default { data() { openData: false } } </script>