How to pass data from different components?

Question

Vue.js

Can't pass Input value from App component to Item component.

Tried everything I could find on google.

------------------ App -------------------

import item from './components/Item.vue'

export default {
  name: "App",
  components: {
    item
  },
  data() {
    return {
      ipnutValue: '',
      items: []
    }
  },
  methods: {
    addNote() {
      this.items.push("item")
      this.ipnutValue = this.itemTitle
      console.log(this.ipnutValue)
      this.ipnutValue = ""
      console.log('Note was create')
    }
  },
};

------------------- Item -------------------

export default {
  name: "item",
  data() {
    return {
      itemTitle: '',
      itemStatus: 'isActive',
      delItem: true
    }
  },
  methods: {
    statusFun: function () {
      if(this.itemStatus === 'isActive') {
        this.itemStatus = 'isDone'
      } else {
        this.itemStatus = 'isActive'
      }
      console.log('Status Working')
    },
    DelFun() {
      console.log('Del BTN Working')
    }
  }
};

Answer 1

props

Answer 2

props or vuex depending on how the item component is positioned