<VueShuttle
class="rectangle-shuttle"
:data="shuttleOne.data"
:height="shuttleOne.height"
>
<template v-slot:source="{ item }">
<div class="rectangle">
<span class="rectangle_name"> {{ item.name }} </span>
<span class="rectangle_sex"> {{ item.sex }} </span>
<span class="rectangle_age"> {{ item.age }} </span>
<p class="rectangle_hobby">
<span v-for=" (h,i) in item.hobby" :key="h+i"> {{ h }} </span>
</p>
</div>
</template>
<template v-slot:target="{ item }">
<div class="rectangle">
<span class="rectangle_name"> {{ item.name }} </span>
<span class="rectangle_sex"> {{ item.sex }} </span>
<span class="rectangle_age"> {{ item.age }} </span>
<p class="rectangle_hobby">
<span v-for=" (h,i) in item.hobby" :key="h+i"> {{ h }} </span>
</p>
</div>
</template>
</VueShuttle>