Vue(12)父子组件的传递——$emit 与 props

1.子组件传值

$emit是把子组件的值传递于父组件

2.实例代码

点击查看详细内容
  <template>
    <div>
      <button @click="datas"></button>
    </div>
  </template>
   
  <script>
  export default {
    methods: {
      datas() {
        this.$emit("info", value);
      }
    }
  };
  </script>

3.父组件传值props

4.实例代码

父组件传值子组件代码
<template>
  <div>{{ users }}</div>
</template>
 
<script>
export default {
  props: ["users"]
};
</script>
父组件传值父组件代码
  <template>
    <div>
      <child :users="user"></child>
    </div>
  </template>
  <script>
  import { child } from "./child";
  export default {
    components: { child },
    data() {
      return {
        user: '张三'
      };
    }
  };
  </script>
posted @ 2022-12-06 16:22  冥天肝  阅读(24)  评论(0编辑  收藏  举报