[Vuejs]-How to determine the parent component โ€“ vuejs

3๐Ÿ‘

โœ…

You can use $parent :

const app = Vue.createApp({
  data() {
    return {
      msg: "one",
    };
  },
})

app.component('test', {
  template: `
    <div>{{ title }}</div>
    <hr />
    <p>From parent:</p>
    <div>{{ expectedProps }}</div>`,
  props: {
    title: {
      type: String,
      default: ''
    },
  },
  computed: {
    expectedProps() {
      return this.$parent.$data
    }
  }
}) 
app.mount('#demo')
<script src="https://unpkg.com/vue@3/dist/vue.global.prod.js"></script>
<div id="demo">
  <test :title="msg"></test>
</div>

Leave a comment