[Vuejs]-How does a single file component pass context.data?

by

0👍

✅

The <tag> component needs a key to use as its child <span>‘s id.

Since <tag> is a functional component, you will have to access to the data via the data. prefix.

So, since you are using <tag v-for="item in list" :key="item"></tag>, inside the <tag>‘s template, you can access the key (of context.data) automatically using data.key:

  • Add :key="data.key" in tag.vue:

      <template functional>
    <span :key="data.key">tag content</span>
  </template>

Demo CodeSandbox: https://codesandbox.io/s/wxmvxnojl?module=%2Fsrc%2Fcomponents%2Ftag.vue

Leave a comment