How to move slot and slot-scope to vue 3 v-slot rule

Viewed 5620

I get this error when I'm using Ant-design table for VueJS

<template slot="name" slot-scope="name"> {{ name.first }} {{ name.last }} </template>

After I changed to Vue 3 rules still nothing showed:

<template v-slot:name v-slot="name"> {{ name.first }} {{ name.last }} </template>

enter image description here

2 Answers

Your markup below doesn't work because it marks the template with two slot names; i.e., the name slot (in v-slot:name) as well as the default slot (in v-slot="name"):

<template v-slot:name v-slot="name"> {{ name.first }} {{ name.last }} </template>
          ^^^^^^^^^^^ ^^^^^^^^^^^^^

Here's the correct fix:

<template v-slot:name="name"> {{ name.first }} {{ name.last }} </template>

According to this documentation you should change slot to v-slot

Related