From 3148538f3f604c20d4aa10f8508214de75eb233c Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Thu, 6 Jan 2022 23:07:32 +0900
Subject: [PATCH] refactor(client): use composition api
---
packages/client/src/components/avatars.vue | 32 +++++++++-------------
1 file changed, 13 insertions(+), 19 deletions(-)
diff --git a/packages/client/src/components/avatars.vue b/packages/client/src/components/avatars.vue
index e843d26daa..958e5db0a1 100644
--- a/packages/client/src/components/avatars.vue
+++ b/packages/client/src/components/avatars.vue
@@ -1,30 +1,24 @@
<template>
<div>
- <div v-for="user in us" :key="user.id" style="display:inline-block;width:32px;height:32px;margin-right:8px;">
+ <div v-for="user in users" :key="user.id" style="display:inline-block;width:32px;height:32px;margin-right:8px;">
<MkAvatar :user="user" style="width:32px;height:32px;" :show-indicator="true"/>
</div>
</div>
</template>
-<script lang="ts">
-import { defineComponent } from 'vue';
+<script lang="ts" setup>
+import { onMounted, ref } from 'vue';
import * as os from '@/os';
-export default defineComponent({
- props: {
- userIds: {
- required: true
- },
- },
- data() {
- return {
- us: []
- };
- },
- async created() {
- this.us = await os.api('users/show', {
- userIds: this.userIds
- });
- }
+const props = defineProps<{
+ userIds: string[];
+}>();
+
+const users = ref([]);
+
+onMounted(async () => {
+ users.value = await os.api('users/show', {
+ userIds: props.userIds
+ });
});
</script>