How to specify "key" as a required prop?

user_3290397 0
Viewed 2809

I want this

export default {

  props: {
    key: {
      type: String,
      required: true,
    },
  },
  ...    
}

But it leads to a runtime error:

[Vue warn]: "key" is a reserved attribute and cannot be used as component prop.

EDIT:

To clarify: I want the reserved attribute "key" to be required. This is because my component relies on the trick of "Forcing component recreation by key change". (link)

vuejs2 vue.js
2 Answers

key is one of special attributes reserved by Vue.js.

It can't be passed as a prop, same as ref, slot, scoped-slot, is.

Simply rename the prop to any name of your choice.

If usage of property named key is crucial inside child component, it is possible to create a computed property key inside child component that will return value from passed prop and will be accessible within child component.

user_53558750

VUE update view because of data's key has changed. the key is special in props. so support you use other word. enter image description here

user_136844290
Related