rashagu / semi-design-vue

Vue3 UI components based on semi-design and Vue
https://www.kousum.asia
MIT License
67 stars 6 forks source link

对于FormSelect和FormSelectOption组件,当选项动态更新时,视图不会随着数据一起更新 #10

Closed 497363983 closed 3 months ago

497363983 commented 4 months ago

以下是一个复现案例,当点击Add按钮向ref数组中添加选项,视图中选项并未添加。

<script lang="ts" setup>
import { onMounted, ref } from "vue"
import { FormSelect, FormSelectOption, Button } from "@kousum/semi-ui-vue"

defineProps<{
    field: string
    label?: string
}>()

onMounted(() => {
    console.log("tableMetaList", tableMetaList)
})
const testOption = ref<string[]>([])
const add = () => {
    testOption.value.push("test" + testOption.value.length)
    console.log("testOption", testOption.value)
}
</script>

<template>
    <FormSelect
        :field="field"
        :label="label"
        :value="'test'"
    >
        <template
            v-for="item in testOption"
        >
            <FormSelectOption :value="item">
                {{ item }}
            </FormSelectOption>
        </template>
    </FormSelect>
    <Button @click="add">Add</Button>
</template>
rashagu commented 3 months ago

已更新至0.12.0