useSet 应用， 操作列表与渲染列表

使用useSet 时，存在数据类型转换的问题。 渲染模板不支持set迭代, 需要将set 类型转换为Array。 对于列表被包裹在对象中的情况。 可以通过创建渲染列表的操作映射，实现利用useSet，操作渲染列表。

export default function usePopForm (props, ctx){

    const localNotifie = ref(props.notifie)
    // 列表set映射
    const [ set, { add, remove, update } ] = useSet(localNotifie.value.target)

    // 响应props
    watch(() => props.notifie, () => {
        localNotifie.value = cloneDeep(props.notifie)
        update(props.notifie.target)
    })
    
    // 同步set到渲染列表
    watch(() => set.value, () =>{
        localNotifie.value.target = [...set.value]
    })

    const onAddHandler = () => {
        add({
            label:"new tag",
            key: 10
        })
    }
    
    const onDelHandler = (val) =>{
        remove(val)
    }

    const onDialogEnterHandler = () => {
        ctx.emit('enter', localNotifie.value)
    }

    const onDialogCancelHandler = () => {
        ctx.emit('cancel')
    }
    

    return {
        localNotifie,
        onAddHandler,
        onDelHandler,
        onDialogEnterHandler,
        onDialogCancelHandler
    }
   
}