Breaking News: Grepper is joining You.com. Read the official announcement!

How to watch prop change with vue composition api

Embarrassed Echidna answered on October 17, 2022 Popularity 6/10 Helpfulness 1/10

answer How to watch prop change with vue composition api

How to watch prop change with vue composition api

Comment

export default defineComponent({
  name: 'MyAwesomestComponent',
  props: {
    title: {
      type: String,
      required: true,
    },
    todos: {
      type: Array as PropType<Todo[]>,
      default: () => [],
    },
    ...
  },
  setup(props){ // this is important--pass the root props object in!!!
    ...
    // Now I need a reactive reference to my "todos" array...
    var todoRef = toRefs(props).todos
    ...
    // I can pass todoRef anywhere, with reactivity intact--changes from parents will flow automatically.
    // To access the "raw" value again:
    todoRef.value
    // Soon we'll have "unref" or "toRaw" or some official way to unwrap a ref object
    // But for now you can just access the magical ".value" attribute
  }
}

Popularity 6/10 Helpfulness 1/10 Language typescript

Source: stackoverflow.com

Tags: prop typescript vue-composition-api watch

Link to this answer
Share Copy Link